【vue系列】高度宽度不等的图片列表自适应

效果图

html

<div class="goods-img-box">
              <img class="goods-img" src="（图片地址）" />
 </div>

javascript

.goods-img-box {
  width: 418px;
  height: 418px;
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.goods-img {
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
}