一、瀏覽器呈現(xiàn)模式和doctype
有的網(wǎng)頁(yè)是遵循標(biāo)準(zhǔn)而創(chuàng)作的，但也有很多不是。即使你不能創(chuàng)建遵循標(biāo)準(zhǔn)的網(wǎng)頁(yè)，也希望瀏覽器根據(jù)標(biāo)準(zhǔn)來(lái)正確顯示那些頁(yè)。目前，大量網(wǎng)頁(yè)充斥著大量非標(biāo)準(zhǔn)代碼，它們?nèi)阅苷５毓ぷ鳌Ｊ聦?shí)上，為舊版瀏覽器設(shè)計(jì)的大多數(shù)代碼都能在新版瀏覽器中正確顯示（雖然呈現(xiàn)方式可能有所區(qū)別）。這是什么原因呢？事實(shí)上，假如嚴(yán)格遵循最新標(biāo)準(zhǔn)，會(huì)完全破壞那些頁(yè)的生存基礎(chǔ)。對(duì)于任何希望有所作為的瀏覽器來(lái)說(shuō)，這當(dāng)然是令人無(wú)法接受的。
瀏覽器呈現(xiàn)模式
現(xiàn)代瀏覽器包括不同的呈現(xiàn)模式，目的是既支持遵循標(biāo)準(zhǔn)的網(wǎng)頁(yè)，也支持為老式瀏覽器而設(shè)計(jì)的網(wǎng)頁(yè)。其中， Standards （標(biāo)準(zhǔn)）模式（也就是嚴(yán)格呈現(xiàn)模式）用于呈現(xiàn)遵循最新標(biāo)準(zhǔn)的網(wǎng)頁(yè)，而 Quirks （包容）模式（也就是松散呈現(xiàn)模式或者兼容模式）用于呈現(xiàn)為傳統(tǒng)瀏覽器而設(shè)計(jì)的網(wǎng)頁(yè)。另外，注意Mozilla/Netscape 6新增了一種 Almost Standards （近似標(biāo)準(zhǔn)）模式，用于支持為標(biāo)準(zhǔn)的某個(gè)老版本而設(shè)計(jì)的網(wǎng)頁(yè)。
什么是 doctype切換？
放在網(wǎng)頁(yè)頂部的doctype聲明是讓瀏覽器進(jìn)入正確呈現(xiàn)模式的關(guān)鍵。瀏覽器自動(dòng)切換到恰當(dāng)?shù)某尸F(xiàn)模式，以便正確顯示由doctype聲明所指定的文檔種類。
理論上，這應(yīng)該是一個(gè)非常直觀的切換。假如doctype指出當(dāng)前網(wǎng)頁(yè)是一個(gè)遵循標(biāo)準(zhǔn)（也就是HTML 4+或XHTML 1+）的文檔，瀏覽器就會(huì)切換到Standards模式。假如沒(méi)有指定doctype，或者指定HTML 3.2以及更老的版本，瀏覽器就切換到Quirks模式。這樣一來(lái)，瀏覽器既能正確顯示遵循標(biāo)準(zhǔn)的文檔，又不至于完全舍棄老式的、與標(biāo)準(zhǔn)不符的網(wǎng)頁(yè)。
doctype切換的問(wèn)題
但是，doctype切換是一個(gè)不完善的方案。即使你在Web文檔中使用了一個(gè)doctype聲明，瀏覽器也可能不會(huì)采取你希望的呈現(xiàn)模式來(lái)顯示網(wǎng)頁(yè)。原因是多方面的，包括形式錯(cuò)誤的doctype，以及不同<?xml version="1.0" encoding="UTF-8"?>) 開(kāi)頭，其中包括XHTML網(wǎng)頁(yè)。然而，IE，Opera和舊版Safari都希望文檔的第一行是doctype聲明。所以，如果在它之前還有其他任何東西（包括XML prolog），就無(wú)法識(shí)別doctype。因此，XML prolog的存在會(huì)使IE，Opera和Safari進(jìn)入Quirks模式。XML prolog并非必需的，所以你可在XHTML網(wǎng)頁(yè)中安全地省略它。注意：一定要在http-equiv meta標(biāo)記中包括一個(gè)charset屬性，以彌補(bǔ)XML prolog中缺失的encoding屬性。
丟失的URL或者相對(duì)URL：
在完整的doctype聲明中，要包括相應(yīng)的文檔類型定義（DTD）文件的URL。如果URL丟失，或者指定的是一個(gè)相對(duì)路徑（而不是完全限定的Internet地址），大多數(shù)瀏覽器都會(huì)進(jìn)入Quirks模式，不管doctype聲明規(guī)定的是什么模式。
形式錯(cuò)誤的doctype ：
瀏覽器對(duì)doctype聲明的形式和格式非常敏感，如果不能識(shí)別一個(gè)形式錯(cuò)誤的doctype，就會(huì)強(qiáng)制進(jìn)入Quirks模式（正是因?yàn)檫@個(gè)原因，所以我們建議將一個(gè)已知正確的doctype拷貝和粘貼到文檔中，而不是親自輸入它）。之所以出現(xiàn)形式錯(cuò)誤的doctype，一個(gè)常見(jiàn)的原因是在doctype 的第一部分與URL之間缺少一個(gè)空格。將一個(gè)分兩行的doctype折疊成單獨(dú)一行，常常會(huì)丟失那個(gè)空格。
過(guò)渡期的 doctype ：
瀏覽器處理過(guò)渡期的doctype時(shí)，最容易出現(xiàn)不一致的問(wèn)題。IE和Opera使用Standards模式；Netscape 6和舊版本的Safari使用Quirks模式；Netscape 7、Mozilla 1和新版本的Safari使用Netscape的Almost Standards模式，它是Standards模式的一個(gè)具有更好容錯(cuò)性的版本。
未知的 doctype ：
瀏覽器在處理不能識(shí)別的doctype時(shí)，也存在不一致的現(xiàn)象。IE和Opera會(huì)進(jìn)入Standards模式；換言之，它假定不能識(shí)別的doctype 是尚未在瀏覽器中集成的一個(gè)新標(biāo)準(zhǔn)。Netscape 6則相反，會(huì)在遇到不能識(shí)別的doctype時(shí)切換到Quirks模式。
doctype切換也許是讓瀏覽器進(jìn)入正確呈現(xiàn)模式并正確顯示網(wǎng)頁(yè)的一種有效手段，前提是你注意到了各種瀏覽器的不一致，并能積極主動(dòng)地避免各種問(wèn)題。
二、使用正確的doctype聲明
我們平時(shí)在做頁(yè)面的時(shí)候可能會(huì)忽視這一點(diǎn)（包括鄙人，通常都是懶于不寫(xiě)而使用瀏覽器默認(rèn)），隨著目前網(wǎng)頁(yè)編碼規(guī)范化熱潮的到來(lái)，大家都有必要了解一下這個(gè)細(xì)節(jié)，會(huì)有用處的。俗話說(shuō)沒(méi)有規(guī)矩不成方圓呢。
雖然大多數(shù)Web文檔的頂部都有doctype聲明，但很多人都沒(méi)有注意它。它是在你新建一個(gè)文檔時(shí)，由Web創(chuàng)作軟件草率處理的眾多細(xì)節(jié)之一。雖然 doctype被許多人忽視，但在遵循標(biāo)準(zhǔn)的任何Web文檔中，它都是一項(xiàng)必需的元素。doctype會(huì)影響代碼驗(yàn)證，并決定了瀏覽器最終如何顯示你的 Web文檔。
doctype的作用
doctype聲明指出閱讀程序應(yīng)該用什么規(guī)則集來(lái)解釋文檔中的標(biāo)記。在Web文檔的情況下，“閱讀程序”通常是瀏覽器或者校驗(yàn)器這樣的一個(gè)程序，“規(guī)則”則是W3C所發(fā)布的一個(gè)文檔類型定義（DTD）中包含的規(guī)則。
每個(gè)DTD都包括一系列標(biāo)記、attributes和properties，它們用于標(biāo)記Web文檔的內(nèi)容；此外還包括一些規(guī)則，它們規(guī)定了哪些標(biāo)記能出現(xiàn)在其他哪些標(biāo)記中。每個(gè)Web建議標(biāo)準(zhǔn)（比如HTML 4 Frameset和XHTML 1.0 Transitional）都有自己的DTD。假如文檔中的標(biāo)記不遵循doctype聲明所指定的DTD，這個(gè)文檔除了不能通過(guò)代碼校驗(yàn)之外，還有可能無(wú)法在瀏覽器中正確顯示。對(duì)于標(biāo)記不一致的問(wèn)題，瀏覽器相較于校驗(yàn)器來(lái)說(shuō)更寬容。但是，不正確的doctype聲明經(jīng)常導(dǎo)致網(wǎng)頁(yè)不正確顯示，或者導(dǎo)致它們根本不能顯示。
選擇正確的doctype
為了獲得正確的doctype聲明，關(guān)鍵就是讓DTD與文檔所遵循的標(biāo)準(zhǔn)對(duì)應(yīng)。例如，假定文檔遵循的是XHTML 1.0 Strict標(biāo)準(zhǔn)，文檔的doctype聲明就應(yīng)該引用相應(yīng)的DTD。另一方面，如果doctype聲明指定的是XHTML DTD，但文檔包含的是舊式風(fēng)格的HTML標(biāo)記，就是不恰當(dāng)?shù)?；類似地，如果doctype聲明指定的是HTML DTD，但文檔包含的是XHTML 1.0 Strict標(biāo)記，同樣是不恰當(dāng)?shù)摹?/p>
有的時(shí)候，也可以根本不使用一個(gè)doctype聲明。如果沒(méi)有指定有效的doctype聲明，大多數(shù)瀏覽器都會(huì)使用一個(gè)內(nèi)建的默認(rèn)DTD。在這種情況下，瀏覽器會(huì)用內(nèi)建的DTD來(lái)試著顯示你所指定的標(biāo)記。對(duì)于一些臨時(shí)性的、匆忙拼湊的文檔（這種文檔有許多），你確實(shí)可以考慮省略doctype聲明，并接受瀏覽器的默認(rèn)顯示。
完全可以從頭編寫(xiě)一個(gè)doctype聲明，并讓它指向自己選擇的一個(gè)DTD。然而，由于大多數(shù)Web文檔都需要遵循由W3C發(fā)布的某個(gè)國(guó)際公認(rèn)的Web標(biāo)準(zhǔn)，所以那些文檔通常都要包含以下標(biāo)準(zhǔn)doctype聲明之一：
HTML 2：<!DOCTYPE html PUBLIC "-//IETF//DTD HTML 2.0//EN">
HTML 3.2：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
HTML 4.01 Strict：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4.01 Transitional：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4.01 Frameset：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0 Strict：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
XHTML 1.1 plus MathML plus SVG：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN" "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
除了上面列出的doctype聲明，具有特殊要求的一些文檔還使用了其他幾種聲明。
doctype聲明通常是文檔的第一行，要在<html>標(biāo)記以及其他文檔內(nèi)容之前。注意，在XHTML文檔中，doctype的前面偶爾會(huì)出現(xiàn)一條XML處理指令（也稱為XML prolog）：<?xml version="1.0" encoding="utf-8"?>
為了確保網(wǎng)頁(yè)正確顯示和順利通過(guò)驗(yàn)證，使用正確的doctype是關(guān)鍵。與內(nèi)容相反的、不正確的或者形式錯(cuò)誤的doctype是大量問(wèn)題的罪魁禍?zhǔn)住?/p>
用DW設(shè)計(jì)網(wǎng)頁(yè)時(shí)，新建一個(gè)文件，看代碼最前面總要出現(xiàn)一個(gè)下面的東東，
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">這個(gè)是DW自動(dòng)在網(wǎng)頁(yè)文件頁(yè)增加了DTD信息，可以刪。 刪除后，瀏覽器會(huì)使用的默認(rèn)DTD。
三、選擇什么樣的DOCTYPE
開(kāi)始制作符合標(biāo)準(zhǔn)的站點(diǎn)，第一件事情就是聲明符合自己需要的DOCTYPE。
查看本頁(yè)原代碼，可以看到第一行就是： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
打開(kāi)一些符合標(biāo)準(zhǔn)的站點(diǎn)，例如著名web設(shè)計(jì)軟件開(kāi)發(fā)商 Macromedia ，設(shè)計(jì)大師 Zeldman 的個(gè)人網(wǎng)站，會(huì)發(fā)現(xiàn)同樣的代碼。而另一些符合標(biāo)準(zhǔn)的站點(diǎn)(例如 k10k.net )的代碼則如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">br>。完整代碼如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
我們選擇什么樣的DOCTYPE
理想情況當(dāng)然是嚴(yán)格的DTD，但對(duì)于我們大多數(shù)剛接觸web標(biāo)準(zhǔn)的設(shè)計(jì)師來(lái)說(shuō)，過(guò)渡的DTD(XHTML 1.0 Transitional)是目前理想選擇(包括本站，使用的也是過(guò)渡型DTD)。因?yàn)檫@種DTD還允許我們使用表現(xiàn)層的標(biāo)識(shí)、元素和屬性，也比較容易通過(guò)W3C的代碼校驗(yàn)。 注：上面說(shuō)的"表現(xiàn)層的標(biāo)識(shí)、屬性"是指那些純粹用來(lái)控制表現(xiàn)的tag，例如用于排版的表格、背景顏色標(biāo)識(shí)等。在XHTML中標(biāo)識(shí)是用來(lái)表示結(jié)構(gòu)的，而不是用來(lái)實(shí)現(xiàn)表現(xiàn)形式，我們過(guò)渡的目的是最終實(shí)現(xiàn)數(shù)據(jù)和表現(xiàn)相分離。
打個(gè)比方：人體模特?fù)Q衣服。模特就好比數(shù)據(jù)，衣服則是表現(xiàn)形式，模特和衣服是分離的，這樣你就可以隨意換衣服。而原來(lái)HTML4中，數(shù)據(jù)和表現(xiàn)是混雜在一起的，要一次性換個(gè)表現(xiàn)形式非常困難。呵呵，有點(diǎn)抽象了，這個(gè)概念需要我們?cè)趹?yīng)用過(guò)程中逐步領(lǐng)會(huì)。
補(bǔ)充
DOCTYPE聲明必須放在每一個(gè)XHTML文檔最頂部，在所有代碼和標(biāo)識(shí)之上。
四、官方是這樣定義 DOCTYPE HTML PUBLIC 的
!DOCTYPE
--------------------------------------------------------------------------------
指定了 HTML 文檔遵循的文檔類型定義(DTD)。
Microsoft? Internet Explorer 6 的新增內(nèi)容。你可使用此聲明將 Internet Explorer 6 及以后版本切換到標(biāo)準(zhǔn)兼容模式下。
語(yǔ)法
HTML 頂級(jí)元素 可用性 "注冊(cè)//組織//類型 標(biāo)簽//定義 語(yǔ)言""URL"
可能值
頂級(jí)元素：指定 DTD 中聲明的頂級(jí)元素類型。這與聲明的 SGML 文檔類型相對(duì)應(yīng)。 HTML 默認(rèn)。HTML。
可用性：指定正式公開(kāi)標(biāo)識(shí)符(FPI)是可公開(kāi)訪問(wèn)的對(duì)象還是系統(tǒng)資源。 PUBLIC 默認(rèn)?？晒_(kāi)訪問(wèn)的對(duì)象。 SYSTEM 系統(tǒng)資源，如本地文件或 URL。
注冊(cè)：指定組織是否由國(guó)際標(biāo)準(zhǔn)化組織(ISO)注冊(cè)。 + 默認(rèn)。組織名稱已注冊(cè)。 - 組織名稱未注冊(cè)。Internet 工程任務(wù)組(IETF)和萬(wàn)維網(wǎng)協(xié)會(huì)(W3C)并非注冊(cè)的 ISO 組織。
組織：指定表明負(fù)責(zé)由 !DOCTYPE 聲明引用的 DTD 的創(chuàng)建和維護(hù)的團(tuán)體或組織的名稱，即 OwnderID。 IETF IETF。 W3C W3C。
類型：指定公開(kāi)文本類，即所引用的對(duì)象類型。 DTD 默認(rèn)。DTD。
標(biāo)簽：指定公開(kāi)文本描述，即對(duì)所引用的公開(kāi)文本的唯一描述性名稱。后面可附帶版本號(hào)。 HTML 默認(rèn)。HTML。
定義：指定文檔類型定義。 Frameset 框架集文檔。 Strict 排除所有 W3C 專家希望逐步淘汰的代表性屬性和元素，因?yàn)闃邮奖硪呀?jīng)很完善了。Transitional 包含除 frameSet 元素的全部?jī)?nèi)容。
語(yǔ)言：指定公開(kāi)文本語(yǔ)言，即用于創(chuàng)建所引用對(duì)象的自然語(yǔ)言編碼系統(tǒng)。該語(yǔ)言定義已編寫(xiě)為 ISO 639 語(yǔ)言代碼(大寫(xiě)兩個(gè)字母)。 EN 默認(rèn)。英語(yǔ)。
URL：指定所引用對(duì)象的位置。
注釋
此聲明必須出現(xiàn)在文檔的起始處，出現(xiàn)在 html 標(biāo)簽之前。
!DOCTYPE 元素不需要關(guān)閉標(biāo)簽。
此元素在 Microsoft? Internet Explorer 3.0 的 HTML 中可用。
你可使用此聲明在 Internet Explorer 6 及以后版本中切換為嚴(yán)格的標(biāo)準(zhǔn)兼容模式。若想打開(kāi)此開(kāi)關(guān)，請(qǐng)?jiān)谀愕奈臋n頂部包含 !DOCTYPE 聲明，在聲明中指定合法的標(biāo)簽，在某些情況下，還需要指定定義和/或 URL。
注意 在標(biāo)準(zhǔn)兼容模式下，不能保證與其它版本的 Internet Explorer 保持兼容。當(dāng)打開(kāi)標(biāo)準(zhǔn)兼容模式時(shí)，文檔的渲染行為也許與將來(lái)版本的 Internet Explorer 不同。若內(nèi)容本來(lái)就是固定的(如刻錄在 CD 上)，則不應(yīng)該使用此模式。
示例
下面的例子演示了如何使用 !DOCTYPE 聲明指定文檔遵從的 DTD，并將 Internet Explorer 6 及更高版本切換到標(biāo)準(zhǔn)兼容模式。 下面例子中的聲明都指定了遵從 HTML 4.0 DTD。第二種聲明指定了“Strict”。第一種聲明沒(méi)有指定。這兩種聲明都將會(huì)把 Internet Explorer 6 及以后版本切換到標(biāo)準(zhǔn)兼容模式。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Strict//EN">
下面例子中的聲明都指定了遵從“Transitional”HTML 4.0 DTD。第二種聲明指定了 DTD 的 URL。第一種聲明沒(méi)有指定。第二種聲明將會(huì)把 Internet Explorer 6 及以后版本切換到標(biāo)準(zhǔn)兼容模式。第一種聲明不會(huì)。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
