需求:图片的高度固定,宽度需自适应,保证图片在缩小的情况下不失帧
效果图:
1.HTML
<div class="img"
:style="{backgroundImage:'url('+item.chainImage+')',backgroundSize:'contain',
backgroundRepeat:'no-repeat'}">
</div>
注:background-size:contain; // 缩小图片来适应元素的尺寸(保持像素的长宽比),是图片宽高最长的那个边覆盖元素一边即可;
2.CSS
.img {
height: 22px;
}