本文转载于:猿2048网站css让不同大小的图片适应div的大小,且不变形。
做成背景图片
单个
.imgdiv { width: 100px; // 你要的正方形 height: 100px; // 你要的正方形 background-image: url(/your/image/path.jpg); background-position: center center; // 居中 background-size: cover; // 填满div background-repeat: no-repeat; }
多个循环时:
<div class="img" :style="{background: `url(${item.goodsMainImage})50% 50% / cover no-repeat`}">
</div>