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

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

詳細純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>

資料整理：珠海網站建設網 http://xjsccl.cn 轉載時請注意標明來源。