CSS 移动开发中更好的图片自适应
阅读(4582)** html **
<div class="pic-wrap">
<img src="http://ww3.sinaimg.cn/mw690/69243898gw1emmeiydzvrj20go08cglu.jpg" alt=""/>
</div>
** css **
.pic-wrap{position: relative; padding-top: 50%;}
.pic-wrap img{position: absolute; left: 0; top: 0; width: 100%; max-width: 640px;}
此方法依赖于一定的结构，因为 padding 的百分比值是相对于宽度的，所以利用 padding-top 设置与宽高等比的百分比值占位，就实现了图片等比缩放的自适应效果。
计算公式： padding-top: 图片高度 * 100% / 图片宽度。
