日韩天天综合网_野战两个奶头被亲到高潮_亚洲日韩欧美精品综合_av女人天堂污污污_视频一区**字幕无弹窗_国产亚洲欧美小视频_国内性爱精品在线免费视频_国产一级电影在线播放_日韩欧美内地福利_亚洲一二三不卡片区

DivCSS教程:DTD(文檔類型)影響margin實現(xiàn)居中的分析_Div+CSS教程

編輯Tag賺U幣
教程Tag:暫無Tag,歡迎添加,賺取U幣!
  Div CSS教程:DTD(文檔類型)影響margin實現(xiàn)居中的分析

 
  什么是DTD呢?也就是文檔類型定義(Document Type Definition),我們在以前的教程中都已經(jīng)經(jīng)過很清楚了,不清楚的朋友可以回過頭仔細的學(xué)習(xí)一下相關(guān)知識:
  CSS代碼結(jié)構(gòu)初探:DOCTYPE文檔類型及瀏覽器的模式
 
  XHTML教程:Doctype文檔類型聲明必不可少!
  

  假如您正使用HTML 4.0,就要在創(chuàng)建的每張網(wǎng)頁的開頭處鍵入下列文檔類型聲明:

示例代碼 [www.hl5o.cn]
<!doctype html public "-//W3C//DTD HTML 4.0 Transitional//EN">

  假如您正使用XHTML 1.0 Transitional,就要在創(chuàng)建的每張網(wǎng)頁的開頭處鍵入下列文檔類型聲明:

示例代碼 [www.hl5o.cn]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

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

  XHTML 1.0 Transitional示例的代碼如下:

div css xhtml xml 代碼調(diào)試框 代碼調(diào)試框 [www.hl5o.cn]

[ 可先修改部分代碼 再運行查看效果 ]

  運行上面的代碼,一切正常,假如我們?nèi)サ鬌TD聲明,發(fā)現(xiàn)頁面就出問題了�?聪旅娴倪\行效果:

div css xhtml xml 代碼調(diào)試框 代碼調(diào)試框 [www.hl5o.cn]

[ 可先修改部分代碼 再運行查看效果 ]

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

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

div css xhtml xml 代碼調(diào)試框 代碼調(diào)試框 [www.hl5o.cn]

[ 可先修改部分代碼 再運行查看效果 ]

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

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

  

/所屬分類:Div+CSS教程/更新時間:2008-06-05
相關(guān)Div+CSS教程