關于在移動網頁中圖片自適應大小的寫法

一般在移動網頁時，圖片屬性寫成如下就可以達到自適應大小

<style type="text/css">
.nameg{background: rgba(000,000,000,0.6);}    
.nameg div{float: left;}
.nameg .a1{width: 10%;background:#000000;}
.nameg .a1 img{width: 100%;height: 100%;display: block;}
.nameg .a2{width: 90%}
</style>
<div class="nameg clearfix"><div class="a1"><img src="iconfont-close..png"></div><div class="a2"></div>
</div>

若在某些特殊時候圖片會出現寬度自動高度卻拉伸的情況下，可以用以下寫法（max-width: 100%; height:auto;display: block;）

注：做用戶圖像圖片時最好使用1比1標準尺寸圖片，且要有默認圖片，否則在占位符時或找不到圖片時依然會出現拉伸現象

<style type="text/css">
.nameg{background: rgba(000,000,000,0.6);}    
.nameg div{float: left;}
.nameg .a1{width: 10%;background:#000000;}
.nameg .a1 img{max-width: 100%; height:auto;display: block;}
.nameg .a2{width: 90%}
</style>
<div class="nameg clearfix"><div class="a1"><img src="iconfont-close..png"></div><div class="a2"></div>
</div>

?