比如我们经常会用到5:3,4:3等图片比例作为缩略图
那么在列表显示的时候，如何保持这个比例，很简单，我们首先把3/5=0.6,那么比例就是0.6.
比例500:300
image.png
alt="">
Web前端开发之html5/css3/jquery #11
class="user-img" alt="">
黑背课堂
290人学习
Laravel
220
120
css关键部分就是.img,less写法
.img {
position: relative;
padding-bottom: 60%;
img
{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
}
类推，如果是5:4，那么就是0.8，
.img {
position: relative;
padding-bottom: 80%;
img
{
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
}
}
