【轉載】圖片 CSS：怎樣才能 「響應式 + 固定寬高比例」？

本身根據項目須要，把代碼摘了出來

<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