在怪癖模式中使用DOCTYPE元素

省略Doctype將瀏覽器置入怪癖模式

如果你已經設計了幾個月以上的網頁，你很可能意識到編寫一個在所有瀏覽器中看起來都一樣的頁面是很困難的。 事實上，這是不可能的。 許多瀏覽器都寫有特殊功能，只有他們可以處理。 或者他們有特殊的處理方式，與其他瀏覽器處理它們的方式不同。 例如：

• 圖層是為在Netscape瀏覽器中使用而創建的。 他們不能在任何其他瀏覽器中工作，事實上在Netscape 6.x +中已被棄用。

• 內聯框架最初只為Internet Explorer創建，並且自此成為HTML規範的一部分。
• Internet Explorer 6.0增加了一個額外的空間（如
  ）周圍的標籤，除非您將div的內容全部寫入一行（長）。 （IE 6有更多的怪癖以及這個。）
• Netscpe 4.7不會顯示沒有用正確的HTML編寫的表格 - 它會顯示一個空白頁面。 這在Netscape 6中得到了修復。

瀏覽器開發者面臨的問題是，他們必須創建與舊版瀏覽器的網頁向後兼容的Web瀏覽器。 為了解決這個問題，瀏覽器製造商為瀏覽器創建了操作模式。這些模式由DOCTYPE元素的存在與否以及DOCTYPE調用的內容定義。

DOCTYPE切換和“怪癖模式”

如果您將以下DOCTYPE放入您的網頁中：

現代瀏覽器（Android 1+，Chrome 1+，IE 6+，iOS 1+，Firefox 1+，Netscape 6+，Opera 6+，Safari 1+）將按照以下方式進行解讀：

1. 因為有一個正確寫入的DOCTYPE，這會觸發標準模式。
2. 這是一個HTML 4.01過渡文檔
3. 由於它處於標準模式，因此大多數瀏覽器都會使用HTML 4.01 Transitional來呈現內容（或大部分是兼容的）

如果您將此DOCTYPE放入您的文檔中：

這告訴現代瀏覽器您想要嚴格遵守DTD來顯示您的HTML 4.01頁面。

這些瀏覽器將進入“嚴格”或“標準”模式，並使頁面符合標準。 （因此，對於這個文檔，瀏覽器可能會完全忽略這些標籤，因為FONT元素在HTML 4.01 Strict中已被棄用）。

如果完全離開DOCTYPE，瀏覽器會自動踢入“怪癖”模式。

下表顯示了常見瀏覽器在使用不同的常見DOCTYPE聲明時所做的操作。

微軟讓它變得更加艱難

Internet Explorer 6還具有如果你在DOCTYPE聲明之上放置任何東西，它們將進入怪癖模式。 因此，即使DOCTYPE聲明聲稱處於嚴格標準模式，這兩個示例都會使IE 6進入怪異模式：

和XHTML 1.1 DOCTYPE：

另外，如果你通過IE6，那麼你就擁有微軟在IE8和IE9中添加的“功能”： META元素切換和網站黑名單。 事實上，這兩個瀏覽器版本現在有多達七種（！）不同的模式：

• IE 5.5怪癖模式（IE 8和9）
• IE 7標準模式（IE 8和9）
• IE 8幾乎是標準模式（IE 8和9）
• IE 8標準模式（IE 8和9）
• IE 9近乎標準模式（IE 9）
• IE 9標準模式（IE 9）
• XML模式（IE 9）

IE 8還引入了“兼容模式”，用戶可以選擇將渲染模型更改回IE 7模式。 因此，即使您使用DOCTYPE和META元素設置了要設置的模式，您的頁面仍可能被推回到不符合標準的模式。

什麼是怪癖模式？

Quirks模式是為了幫助處理所有奇怪的渲染和不兼容的瀏覽器支持以及網頁設計人員用來處理這些事情的黑客。 瀏覽器製造商所擔心的是，如果他們將瀏覽器切換到完全符合規範的情況，網頁設計師將被拋在後面。

通過設置DOCTYPE切換和“怪癖模式”，網頁設計師可以選擇他們希望瀏覽器呈現HTML的方式。

怪癖模式的影響

大多數瀏覽器在怪癖模式中使用了幾種效果：

• 在某些瀏覽器中，盒子模型在怪癖模式下更改為盒子模型的IE 5.5版本。
• 某些瀏覽器不會將樣式繼承到表中
• 怪異模式會極大地影響CSS和CSS佈局的解析，如果您將頁面從怪異模式轉換為標準模式，請務必測試您的CSS佈局並進行大量解析。
• 在怪癖模式下觀察對腳本的更改。 例如，Firefox改變了id屬性的工作方式。 IE8和IE9在怪癖模式下對腳本進行了非常戲劇性的改變。

“幾乎標準模式”也有所不同

• 只有圖像內部的表格單元的高度與標準模式不同。

如何選擇DOCTYPE

我在我的文章DOCTYPE列表中進一步詳細了解，但這裡有一些一般的經驗法則：

1. 總是先選擇標準模式。 目前您應該使用的標準是HTML5：
   除非您有避免使用HTML5 DOCTYPE的具體原因，否則這是您應該使用的。
2. 如果您需要驗證遺留元素或者出於某種原因想要避免新功能，請轉至嚴格的HTML 4.01：

3. 如果您在表中切片圖像並且不想修復它們，請轉至過渡HTML 4.01：

4. 不要刻意以怪癖模式寫頁面。 始終使用DOCTYPE。 這將為您節省將來的開發時間，並且確實沒有任何好處。 IE6正在迅速流行，並且通過為這款瀏覽器設計（這本質上是以怪癖模式進行設計的），你正在限制自己，你的讀者和你的頁面。 如果您必須為IE 6或7編寫代碼，請使用條件註釋來支持它們，而不是強迫現代瀏覽器進入怪癖模式。

為什麼使用DOCTYPE

一旦您意識到這種類型的DOCTYPE切換正在進行，您可以通過使用DOCTYPE更直接地影響您的網頁，該DOCTYPE指示瀏覽器可以從您的頁面期望什麼。 另外，一旦你開始使用DOCTYPE，你將會編寫更接近於有效的HTML（你仍然應該驗證它）。 通過編寫有效的XHTML，您鼓勵瀏覽器製造商構建符合標準的瀏覽器。

瀏覽器版本和怪癖模式