Div CSS教程：DTD（文檔類型）影響margin實現居中的分析

　
　　什么是DTD呢？也就是文檔類型定義（Document Type Definition），我們在以前的教程中都已經經過很清楚了，不清楚的朋友可以回過頭仔細的學習一下相關知識：
　　CSS代碼結構初探：DOCTYPE文檔類型及瀏覽器的模式
　
　　XHTML教程：Doctype文檔類型聲明必不可少！
　　

　　假如您正使用HTML 4.0，就要在創建的每張網頁的開頭處鍵入下列文檔類型聲明：


　　假如您正使用XHTML 1.0 Transitional，就要在創建的每張網頁的開頭處鍵入下列文檔類型聲明：


　　通常我們在使用XHTML 1.0 文檔類型聲明下解決頁面的居中問題是通過margin:0 auto;
　　請您注重：margin:0 auto; 與margin-right:auto; margin-left:auto;是等同的效果。上面的代碼是一種簡寫的形式。
　　關于CSS屬性的縮寫，您可以參考下面的文章：
　　CSS中級教程 快捷屬性縮寫
　

　　XHTML 1.0 Transitional示例的代碼如下：


　　運行上面的代碼，一切正常，假如我們去掉DTD聲明，發現頁面就出問題了。看下面的運行效果：


　　然而頁面可能使用的是HTML 4.0文檔類型聲明，如何才能讓頁面居中呢，顯然很多朋友已經發現了，同樣的代碼，同樣的margin:0 auto;頁面容器居左了，解決辦法如下：
　　主要的定義樣式：
　　body {text-align:center; }
　　#container {margin:0 auto; width:500px; background:#ccc;}

　　當您定義text-align:center;以后，會發現在IE下頁面已經居中了，但是您會發現在mozilla下頁面仍然是居左的，解決辦法就是在子元素定義時候設定時再加上“margin:0 auto;”這樣就可以完成頁面容器居中的效果。
　　假如你需要定義文字居中，需要單獨進行設置，例如：#container { text-align:left;}
　　代碼如下：


　　注重：假如您想用這個方法使整個頁面要居中，建議在內容較多時不要套在一個DIV里，可以依次拆出多個div，只要在每個拆出的div里定義margin:0 auto;就可以了。假如內容不是非常多可以定義一個wrap層，讓這一層居中即可。

　　總結：
　　margin在HTML 4.0文檔類型聲明下使頁面居中首先要在父元素定義“text-align:center”然后在子元素定義的時候再加上“margin:0 auto;”即可。文字的居中，可以用“text-align:left”進行還原操作。
　　margin在XHTML 1.0文檔類型聲明下通過“margin:0 auto”即可定義頁面容器居中。