防止圖片撐破頁面的CSS代碼

前言：在做網(wǎng)站的時(shí)候，一部分人會遇到上傳的圖片太大了，把網(wǎng)站頁面給撐破了，這樣網(wǎng)站也不美觀了。當(dāng)然了，上傳到網(wǎng)站的圖片如果能用圖片處理軟件處理下那是最好的，既美觀又節(jié)省空間容量，但是很多人還是不太會用圖片處理軟件，那么網(wǎng)訊互聯(lián)就教大家用純CSS代碼的方式來防止圖片撐破網(wǎng)站頁面，圖片會自動按比例縮小。

詳細(xì)純css的防止圖片撐破頁面的代碼：

CSS代碼：

<style type="text/css">
.content-width {MARGIN: auto;WIDTH: 600px;}
.content-width img{MAX-WIDTH: 100%!important;HEIGHT: auto!important;width:expression(this.width > 600 ? "600px" : this.width)!important;}
</style>

插入位置代碼：

<div class="content-width">
  <p><img src="圖片路徑"/></p>
  <p><img src="圖片路徑"/></p>
</div>

資料整理：珠海網(wǎng)站建設(shè)網(wǎng) http://yngytx.cn 轉(zhuǎn)載時(shí)請注意標(biāo)明來源。