如何用CSS控制圖片自適應大小？_Div+CSS教程

教程Tag：暫無Tag,歡迎添加,賺取U幣!

　　
　　圖片自動適應大小是一個非經常用的功能，在進行制作的時候為了防止圖片撐開容器而對圖片的尺寸進行必要的控制，我們可不可以用CSS控制圖片使它自適應大小呢？

　　我們想到了一個比較簡單的解決方法，雖然不是非常的完美，假如您的要求不是非常高，已經可以滿足你的需要了。我們看下面的代碼：

示例代碼 [www.wf0088.com]

div img {
max-width:600px;
width:600px;
width:expression(document.body.clientWidth>600?"600px":"auto");
overflow:hidden;
}

　◎ max-width:600px; 在IE7、FF等其他非IE瀏覽器下最大寬度為600px。但在IE6中無效。
　◎ width:600px; 在所有瀏覽器中圖片的大小為600px;
　◎ 當圖片大小大于600px，自動縮小為600px。在IE6中有效。
　◎ overflow:hidden; 超出的部分隱藏，避免控制圖片大小失敗而引起的撐開變形。
　　