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