本文向大家描述一下DIV和Table頁面布局的區別和聯系，一般來說Table開發快，容易控制，浏覽器兼容也好些，至於DIV的優勢請看下文詳解。
DIV和Table頁面布局的區別和聯系
現在對於網頁制作是選擇傳統的Table還是用新型的DIV，有分歧。一部分說還是用Table好，開發快，容易控制，浏覽器兼容也好些；另一部分認為DIV好，以後的發展趨勢,主要是如下原因：
DIV+CSS布局比Table布局節省頁面代碼，代碼結構也更清晰明了。
DIV+CSS開發速度要比Table快，而且布局更精確，不過手寫代碼明顯增加DIV+CSS布局，使網站版面布局修改變的更簡單。
DIV+CSS布局能夠適應未來多種客戶端需求。
DIV+CSS布局節約站點所占空間和站點流量。這些都是DIV的好處。
DIV有這麼多好處是不是有些心動，決定學它。DIV和Table各有長處，通常情況下它們可以互換使用。
我感覺正確的符合標准的設計思路是：使用DIV等布局元素來制作頁面的設計布局，定位，色塊，圖片等。使用Table，UL等這樣的元素來顯示頁面中需要展示的數據。因為DIV不會像Table一樣，在IE下要將整個Table下載完後才全部顯示內容(Firefox不會)，所以用Table來布局顯然是不合適的，尤其是數據量大時，在IE下用Table會發現慢的多。而DIV就好多了。當然,DIV也起整理數據的作用。
DIV用於布局，Table用於顯示數據，這是現在最基本的設計原則。
1：Table裡可以內嵌DIV。反之DIV可以內嵌Table嗎？？
當然可以了。
◆DIV定義
表示一塊可顯示Html的區域。
SpecifIEsacontainerthatrendersHtml.
注釋
此元素在InternetExplorer3.0及以上版本的Html中可用，在InternetExplorer4.0及以上版本的腳本中可用。
此元素是塊元素。
此元素需要關閉標簽。
- TheDIVelementisavailableinHtmlasofInternetExplorer3.0,
- andinscriptasof
- InternetExplorer4.0.
- Thiselementisablockelement.
- Thiselementrequiresaclosingtag.
示例代碼
下面的例子使用了兩個DIV元素對兩段文字進行了不同的對齊處理。
- ThisexampleusestwoDIVelementstoaligntwosectionsoftextdifferently.
- <DIV>
- 此文本代表一段。可以在這裡放你的Html或文本
- </DIV>
- <DIVALIGNDIVALIGN=CENTER>
- 此文本代表另外一段，其中文本居中顯示。
- </DIV>
DIV本身就是容器性質的，你不但可以內嵌Table還可以內嵌文本和其它的Html代碼。
2:DIV是不是跟Table一樣的作用？
DIV的作用跟Table是差不多的，但是DIV對XML的支持更好而且使用起來比較靈活，因此被推薦為新的網頁布局方式。
3:DIV Table哪個速度快？
DIV相對比較快，網頁內容的顯示需要將相對一整塊的內容下載完成後再顯示。使用DIV布局是許多的獨立的相對較小的范圍，而使用Table布局一般都會表格嵌套多層形成較大的下載范圍。
【編輯推薦】