網頁中防止表格被撐破的方法總結

網頁製作中,防止表格被撐破的總結的4種方法，希望對大家有用！

一、使用<img src="/images/NullPic.gif" width="400" height="300">直接固定圖片的大小。

這種方法不會引起頁面顯示的錯亂，但是顯示的圖片經常是變形了的。

最不推薦了。

二、使用<img src="/images/NullPic.gif" >

這種方法會在調用圖片的時候，會自動按比例縮小到指定的寬度，不會引起圖片的變形，並且也不會撐破表格，因此就不會引起頁面顯示的錯亂。

但也有一個缺點，如果圖片太大，在顯示圖片過程（下載過程）中，還是會先以圖片原大小顯示，這時就會撐破表格，頁面很難看。當然，當圖片完全顯示之後會自動縮小的。

三、為了防止圖片撐破表格，在上述基礎上，對錶格進行限制：

在表格的標籤<table>中加入一些限制代碼，<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">就可以有效地防止表格被撐開了。

四、更進一步，用鼠標滾輪可以縮小放大圖片的代碼：

<SCRIPT type=text/javascript>
function bbimg(o){
var zoom=parseInt(o.style.zoom, 10)||100;zoom+=event.wheelDelta/12;if (zoom>0) o.style.zoom=zoom+'%';
return false;
}
</SCRIPT>

使用方法如下：

<img src="/images/NullPic.gif" >

也可以用樣式:

img {
max-width: 500px; width:expression(this.width > 500 ? "500px" : this.width)
}