最近接到一个小改动的需求：列表展示图片时，要求在不挤压拉伸图 - 伍ZY - 沸点 - 掘金

前端工程师 @浙江省时空智子大数据有限公司

最近接到一个小改动的需求：列表展示图片时，要求在不挤压拉伸图片的情况下，展示图片相对居中的那一部分，例如：竖向长方形的图片，就要去头去尾展示中间的部分，横向长方形的图片，就要去左去右；像很一段时间，并没有找到合适的解决方法；看到某一段网友另辟蹊径的方法：设为背景图，
.dd{
display: block;
width: calc(50% - 5px);
height: 1px;
padding: 0 0 48% 0;
float: left;
overflow: hidden;
background-image:url('../images/img.png');
background-position:center;
background-repeat: no-repeat;
background-size: cover;
}
其中background-image是通过vue的语句动态加载的，效果看图片我截取了列表和预览效果；

展开

今天学到了

等人赞过