使用css 實現圖片自適應大小


在編寫網頁時,如果圖片大小事先是未知的,如果圖片過大的話,會影響的網頁中其他塊的結構

使用css可以將圖片的大小調整到一個固定的值

#mian img{
 max-width:170px;
 width:170px;
 width:expression(document.body.clientWidth>170?"170px":"auto");
 max-height:180px;
 height:180px;
 height:expression(document.body.clientWidth>180?"180px":"auto");
 overflow:hidden;
}

 在如下html代碼中

<div id = "maim">
<!--
在mian樣式的塊中img標簽圖片的大小會被固定在170px*180px
-->
<img src="01.jpg">
</div>

 如果圖片的大小是事先未知的,這樣設置可以使,圖像的大小固定,從而不影響網頁中其他塊的結構


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM