在這篇文章開篇，我先糾正一下我之前寫的一篇入門文章的錯誤，還是先引用一下比較官方的說法吧，避免再次誤導各位新手
「 宣告必須位於
html5
文件中的第一行，也就是位於
標籤之前。該標籤告知瀏覽器文件所使用的
html
規範。doctype 宣告不屬於
html
標籤；tag;
它是一條指令，告訴瀏覽器編寫頁面所用的標記的版本。
在所有 html
文件中規定
doctype
是非常重要的，這樣瀏覽器就能了解預期的文件型別。
html 4.01 中的
doctype
需要對
dtd
進行引用，因為
html 4.01
基於 sgml
。而 html 5
不基於
sgml
，因此不需要對
dtd
進行引用，但是需要
doctype
來規範瀏覽器的行為（讓瀏覽器按照它們應該的方式來執行。）。
」在 html 4.01
中有 3
個不同的文件型別，在
html 5
中只有乙個：
因為html5
這個宣告文件型別的標籤是向下相容的，所以即使你的
html
基本不使用
html5
的標籤 ，你也可以使用這個宣告方式，但是頁面中會有某些不相容的地方，這個就需要你根據實際情況來修正了。
可以讓瀏覽器在嚴格模式（標準模式）下渲染頁面，而不需要指定某個型別
dtd。
再進入今天的主體：table
和div
的合理應用
table在早期的頁面設計中應用廣泛，但是隨著網際網路的發展
table
漸漸被拋棄，現在網際網路上只有一小部分老站（有名氣，不必要改的那種有很多），還是沿用著
table
來布局頁面，現在的新站基本上都是使用了
div+css
來布局頁面，但是很多
web前端初入門的朋友就會產生一種錯覺，認為
table
會是頁面對搜尋引擎不友好的元凶，所以在設計列表的時候總是會去使用
dt ，
ul 之類的標籤。這樣有的使用會讓你多花很多設計頁面樣式的時間，而真正對搜尋引擎優化的效果很微弱。
大量使用table
的乙個非常大的弊端除了對搜尋引擎不友好，還有就是對程式設計師也非常的不友好，
table
的大量巢狀，會讓人看的很暈。但是如果配合著
div使用的話就會提供效果，達到的效果或許比dt，
ul來的更加好。
還有乙個問題就是大量的table tr td
大家也可以自己動手操作，用谷歌瀏覽器去掉它的css
鏈結，然後再看它的頁面布局，你會發現，它的所有的標題，列表，都井然有序，就像是寫**的時候非常正規的排版一樣，即使不要樣式表，相信大家也不會產生非常大的厭惡感，但是有些**就不一樣了，去掉
css樣式檔案之後，頁面直接就癱了，這裡再發個站
www.webgamei.com
去掉它的
css樣式檔案 （
2個） 再看頁面，因為它的樣式很多都是直接寫進
table
中的style
中，所以你看起來沒有很大的變化，但是你看導航部分，會發現，頁面毫無語義感，若是頁面的樣式分離開了，那去掉
css檔案，估計沒法看了。
所以這裡建議，在你的頁面設計出來之後，你可以先不去加css
樣式，直接先把預設樣式的版面寫出來，在根據頁面去加
css自定義樣式，這樣會不會更高效點呢 ，呵呵 ，我沒試過，只是這麼想而以。
關於語義的內容很多，這裡我也不說太多了，介紹大家一本書 《編寫高質量**--web
前端開發修煉之道》很不錯的一本書，裡面對語義化介紹的很清楚。頁面布局是乙個經驗積累的過程，看到好的**，它的頁面布局，你都可以借鑑一下，看到不好的，你也可以想一下該怎麼去優化它，這樣才能在
web前端之路上成長更快。
寫的不詳盡之處還請web前輩指正，謝謝
Table和div的知識
web1班名冊 學號姓名 性別年齡張三男 李四女人數合計 的組成部分 標題 表頭 主體 表尾 table 定義乙個 caption 定義 的標題 thead 定義表頭的部分 tbody 定義 的主體 資料 部分 tfoot 定義表尾 一般來顯示彙總資訊 tr 定義一行 th td 來定義資料項 單元...
div中table的寬度超過div的寬度問題
首先注意table的乙個樣式 table tablelayout 屬性用來設定 單元格 行 列顯示屬性。table layout有以下取值 值描述 automatic 預設。列寬度由單元格內容設定 fixed 列寬由 寬度和列寬度設定。inherit 規定應該從父元素繼承 table layout ...
div和table 用作布局的 區別
本文向大家描述一下div和table頁面布局的區別和聯絡，一般來說table開發快，容易控制，瀏覽器相容也好些，另一部分認為div好，是以後的發展趨勢，主要原因請看下文詳細介紹。div布局和table頁面布局的區別和聯絡 現在對於網頁製作是選擇傳統的table還是用新型的div，有分歧。一部分說還是...