自己根据项目需要,把代码摘了出来
<div class="img-box"></div>
.img-box{
height:0;
padding-bottom:100%;
overflow:hidden;
width:100%;//可以是个固定值 项目里用的百分比
background-size:100% 100%;
background-position:center center;
background-repeat:no-repeat;
background-image:url(...../...png);
}
最终效果就是等比的四四方方的图标.....
参考原文:https://ruby-china.org/topics/17011