CSS控製圖片大小的方法

網頁製作技巧執行個體解決：用CSS控製圖片自適應大小

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

可以通過按比例縮小或者放大到某尺寸（自己指定），來保持圖片不變形走樣的完全顯示。

解決方案：

 一、   對於標準瀏覽器（如Firefox），或者最新都IE7瀏覽器，直接使用max-width,max-height；或者min-width,min-height的CSS屬性即可。如：

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

img{  max-width:100px;  max-height:100px;  overflow:hidden;}

二、對於IE6及其以下版本的瀏覽器，則可以利用其支援的expression屬性，在css code中嵌入javascript code來實現圖片的縮放：

img{   width:expression(this.width>150?"150px":this.width);   height:expression(this.height>150?"  150px":this.height); }

三、完美解決方案

img{   border:0;   margin:0;   padding:0;   max-width:150px;   width:expression(this.width>150?"150px":this.width);   max-height:150px;   height:expression(this.height>150?"  150px":this.height); }

參考地址：

http://www.cnblogs.com/liukai/archive/2009/12/29/1635397.htmlhttp://www.php100.com/html/webkaifa/DIV_CSS/2008/1124/2362.html