当UI出好图时，图片的格式都是有一定比例。但是你不知道的是从后台拉取的图片到底是什么比例的。
如果给图片写死宽高的话，就会出现图片变形的问题。这个时候产品就会找你说话了。。。
目前的处理有两种方式
１，通过背景图的方式处理。通过background-size作用在容器上
<div class="img_background" style="background-image: url('2.jpg');"></div>
.img_background{
width: 300px;
height: 200px;
border: 1px solid red;
background:url('default.jpg') no-repeat center;
background-size: cover;
}
2，对图片使用使用object-fit:cover(推荐使用)
<div class="img_fit">
<img src="2.jpg"/>
</div>
.img_fit{
width: 300px;
height: 200px;
border: 1px solid red;
}
.img_fit img{
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
