前言
為了協助確保你的網頁在所有未來的IE版本都有一致的外觀，IE8引入了檔案相容性。在IE6中引入一個增設的相容模式，檔案相容性使你能夠在IE呈現你的網頁時選擇特定編譯模式。
新的IE為了確保網頁在未來的版本中都有一支的外觀，IE8引入了檔案相容性。當你引入一個增設的相容模式，
此文章說明檔案相容性的必要性，列出現有版本IE能使用的檔案相容模式並示範如何選擇特定的相容模式。
瞭解檔案相容性的必要性
每個主要版本IE新增的功能都是為了讓瀏覽器更容易使用、增加安全性及更支援業界標準。以這些作為IE的特色，其中一個風險就是舊版本網站無法正確的顯示。
為了將這個風險降到最低，IE6允許網頁開發人員選擇IE編譯和顯示他們網頁的方式。"Quirks mode"為預設，這會使頁面以舊版本瀏覽器的視點顯示，"Standards mode"(也稱為"strict mode")特點是支援業界標準最為完善。然而要利用這個增強支援功能，網頁必須包含恰當的<!DOCTYPE>指令。
若一個網頁沒有包含<!DOCTYPE>指令，IE6會將它以quirks mode顯示。若網頁包含有效<!DOCTYPE>指令但瀏覽器無法辨識，IE6會將它以IE6 standards mode顯示。因為少數網站已經包含<!DOCTYPE>指令，相容模式的切換相當成功。這使網頁開發人員能選擇將他們的網頁轉移為standards mode的最佳時機。
隨著時間經過，更多網站開始使用standards mode。它們也開始使用IE6的特性和功能來檢測IE。舉例來說，IE6不支援universal selector(即css之全域選取器 * {})，一些網站便使用它來針對IE做特定的對應。
當 IE7增加了對全域選取器的支援，那些依賴IE6特點的網站便無法偵測出這個新版本的瀏覽器。因此那些針對IE的特定對應無法應用於IE7，造成這些網站便無法如他們預期的顯示。由於<!DOCTYPE>只支援兩種相容模式，受到影響的網站擁有者被迫更新他們的網站使其能支援IE7。
IE8 比之前的任何版本瀏覽器都更支援業界標準，因此針對舊版本瀏覽器設計的網頁可能無法如預期般呈現。為了協助減輕所有問題，IE8引入檔案相容性的概念，使你能選擇你的網頁設計要對應的特定IE版本。檔案相容性在IE8增加了一些新的模式，這些模式能告訴瀏覽器如何解析和編譯一個網頁。若你的網頁無法在 ie8正確的顯示，你可以更新你的網站使它支援最新的網頁標準(優先選項)或在你的頁面上新增一個meta元素用於告訴IE8如何依照舊版本瀏覽器編譯你的頁面。
這能讓你選擇將你的網站更新支援IE8新特點的時機。
認識檔案相容模式
IE8支援幾種檔案相容模式，它們具有不同的特性並影響內容顯示的方式。
•Emulate IE8 mode指示IE使用<!DOCTYPE>指令來決定如何編譯內容。Standards mode指令會顯示成IE8 Standards mode而quirks mode會顯示成IE5 mode。不同於IE8 mode，Emulate IE8 mode重視<!DOCTYPE>指令。
•Emulate IE7 mode指示IE使用<!DOCTYPE>指令來決定如何編譯內容。Standards mode指令會顯示成IE7 Standards mode而quirks mode會顯示成IE5 mode。不同於IE7 mode，Emulate IE7 mode重視<!DOCTYPE>指令。對於許多網頁來說這是最推薦的相容模式。
•IE5 mode 編譯內容如同IE7的quirks mode之顯示狀況，和IE5中顯示的非常類似。
•IE7 mode編譯內容如同IE7的standards mode之顯示狀況，無論網頁是否含有<!DOCTYPE>指令。
•IE8 mode提供對業界標準的最高支援，包含 W3C Cascading Style Sheets Level 2.1 Specification和W3C Selectors API，並有限的支援 W3C Cascading Style Sheets Level 3 Specification (Working Draft)。
•Edge mode指示IE以目前可用的最高模式顯示內容。當使用IE8時其等同於IE8 mode。若(假定)未來放出支援更高相容模式的IE，使用Edge mode的頁面會使用該版本能支援的最高模式來顯示內容。同樣的那些頁面在使用IE8瀏覽時仍會照常顯示。
由於edge mode使用該IE版本所能支援的最高模式來顯示所瀏覽的網頁內容，建議僅使用於測試頁及其他非商用頁面。
指定檔案相容模式
要為你的網頁指定檔案模式，需要在你的網頁中使用meta元素放入X-UA-Compatible http-equiv 標題。以下是指定為Emulate IE7 mode 相容性之範例。
<html>
<head>
<!-- Mimic Internet Explorer 7 -->
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
<title>My Web Page</title>
</head>
<body>
<p>Content goes here.</p>
</body>
</html>
其內容隨著指定的頁面模式而更改，當要類比IE7時，指定IE=EmulateIE7，指定IE=5, IE=7, 或IE=8來選擇其中一種相容模式。你也可以指定IE=edge來指示IE8使用它支援的最高模式。
X-UA-compatible標題沒有大小寫之分。然而除了title元素及其他的meta元素之外，它必須出現在網頁header節其它元素之前的位置，
設定網站伺服器以指定預設相容模式
網站管理員可籍著為網站定義一個自訂標題來為他們的網站預設一個特定的檔案相容模式。這個特定的方法取決於你的網站伺服器。舉例來說，下列的web.config檔案使Microsoft Internet Information Services (IIS)能定義一個自訂標題以自動使用IE7 mode來編譯所有網頁。
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<httpProtocol>
<customHeaders>
<clear />
<add name="X-UA-Compatible" value="IE=EmulateIE7" />
</customHeaders>
</httpProtocol>
</system.webServer>
</configuration>
若你已於網站伺服器指定了一個預設的檔案相容模式，你可以在個別頁面上指定不同的檔案相容模式來蓋過它。在網頁中指定的模式優先權高於伺服器中所指定的模式。
請查閱你的網站伺服器關於指定自訂標題的資訊，或看更多資料:
Implementing the META Switch on Apache
Implementing the META Switch on IIS
判定檔案相容模式
要判定網頁使用IE8瀏覽時的檔案相容模式，使用document object(文檔對象)的documentMode功能。例如在IE8的網址列輸入下列程式碼會顯示目前頁面的檔案模式。
javascript:alert(document.documentMode);
documentMode功能會回傳一個數值對應目前頁面的檔案相容模式，舉例來說，若網頁指定為支援IE8模式，documentMode便會回傳值"8"。
在IE6引入的compatMode功能不支援在IE8引入的documentMode功能。目前使用compatMode建立的應用程式還能在IE8中作用，但它們必須更新為使用documentMode。
若你希望使用JavaScript判定一個檔案的相容模式，引入下面範例的這段程式碼可支援舊版本的IE。
engine = null;
if (window.navigator.appName == "Microsoft Internet Explorer")
{
// This is an IE browser. What mode is the engine in?
if (document.documentMode) // IE8
engine = document.documentMode;
else // IE 5-7
{
engine = 5; // Assume quirks mode unless proven otherwise
if (document.compatMode)
{
if (document.compatMode == "CSS1Compat")
engine = 7; // standards mode
}
}
// the engine variable now contains the document compatibility mode.
}
認識內容屬性值
內容屬性值在接收到異於先前敘述的數值時是具有彈性的。這能使你對於IE如何顯示你的網頁更有操控性。舉例來說，你可以設定內容屬性值為IE=7.5。當你這樣做的時候，IE嘗試將這個值轉換為version vector並選擇最接近的結果。在這個例子中，IE會將其設定為IE7 mode。下面的範例顯示該模式設定為其他值的狀況。
<meta http-equiv="X-UA-Compatible" content="IE=4"> <!-- IE5 mode -->
<meta http-equiv="X-UA-Compatible" content="IE=7.5"> <!-- IE7 mode -->
<meta http-equiv="X-UA-Compatible" content="IE=100"> <!-- IE8 mode -->
<meta http-equiv="X-UA-Compatible" content="IE=a"> <!-- IE5 mode -->
<!-- This header mimics Internet Explorer 7 and uses
<!DOCTYPE> to determine how to display the Web page -->
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
注意: 前面的範例顯示單獨的內容值。實際上IE只會執行網頁中第一個X-UA-Compatible標題。
你也可以使用內容屬性來指定複數的檔案相容模式，這能協助確保你的網頁在未來的瀏覽器版本都能一致的顯示。欲設定複數的檔案模式，請設定內容屬性以判別你想使用的模式。使用分號來分開各個模式。
如果一個特定版本的IE支援所要求的相容模式多於一種，將採用列於標題內容屬性中最高的可用模式。你可以使用這個特性來排除特定的相容模式，雖然並不推薦這樣做。舉例來說，下列標題即會排除IE7 mode。
<meta http-equiv="X-UA-Compatible" content="IE=5; IE=8" />
結論
相容性對於網頁設計師來說是非常重要的顧慮。雖然最好是可以建立一個完全不需依賴任何網頁瀏覽器特性或功能的網站，有時候這是不可能實現的。檔案相容模式便能將網頁限制在某個特定版本的IE中。
使用X-UA-Compatible標題來指定你的頁面支援的IE版本。使用document.documentMode判定頁面的相容模式。
選擇支援某個特定版本的IE，你可以確保你的頁面在未來的瀏覽器版本中也能有顯示的一致性。
1.<meta http-equiv="X-UA-Compatible" content="IE=5" />
像是使用了 Windows Internet Explorer 7 的 Quirks 模式，這與 Windows Internet Explorer 5 顯示內容的方式很相似。
2.<meta http-equiv="X-UA-Compatible" content="IE=7" />
無論頁面是否包含 <!DOCTYPE> 指令，都像是使用了 Windows Internet Explorer 7 的標準模式。
3.<meta http-equiv="X-UA-Compatible" content="IE=8" />
4.<meta http-equiv="X-UA-Compatible" content="edge" />
Edge 模式通知 Windows Internet Explorer 以最進階別的可用模式顯示內容，這實際上破壞了“鎖定”模式。
5.<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
EmulateIE7 模式通知 Windows Internet Explorer 使用 <!DOCTYPE> 指令確定如何呈現內容。標準模式指令以Windows Internet Explorer 7 標準模式顯示，而 Quirks 模式指令以 IE5 模式顯示。與 IE7 模式不同，EmulateIE7 模式遵循 <!DOCTYPE> 指令。對於多數網站來說，它是首選的相容模式。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
