<!--一个盒子放4张图片,让图片的宽高一样,可自适应盒子宽度 使用padding和 position定位-->
<ul>
<li><p><img src="" /></p></li>
<li><p><img src="" /></p></li>
<li><p><img src="" /></p></li>
<li><p><img src="" /></p></li>
</ul>
<style>
ul{
width:100%;
}
li{
width: 23%;
margin: 10px 1%;
float: left;
}
p{
width: 100%;
height: 0;
padding-bottom: 100%;
position: relative;
overflow: hidden;
}
img{
position: absolute;
display: block;
width: 100%;
height: 100%;
}
</style>
如何让一个百分比宽的盒子宽高一样
猜你喜欢
转载自blog.csdn.net/qq_37144354/article/details/80360726
今日推荐
周排行