圖片自動適應大小是一個非常常用的功能,在進行制作的時候為了防止圖片撐開容器而對圖片的尺寸進行必要的控制。
代碼:
.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; 超出的部分隱藏,避免控制圖片大小失敗而引起的撐開變形