再談 X-UA-Compatible 兼容模式

如何理解 IE 的文檔兼容模式（X-UA-Compatible）？

IE 瀏覽器支持多種文檔兼容模式，得以因此改變頁面的渲染效果。

IE9 模式支持全范圍的既定行業標準，包括 HTML5（草案）, W3C CSS Level 3 規范（草案）, SVG 1.0 規范等

<meta http-equiv="X-UA-Compatible" content="IE=9">

IE8 模式支持許多既定行業標準，W3C CSS Level 2.1 規范和 W3C Selectors API，有限支持 W3C CSS Level 3 規范（草案）和其他行業標準

<meta http-equiv="X-UA-Compatible" content="IE=8">

IE7 模式強制瀏覽器按照 IE 7 標準模式渲染文檔，忽略是否定義指令

<meta http-equiv="X-UA-Compatible" content="IE=7">

Emulate IE9 模式告訴 IE 使用指令來決定如果渲染文檔。標準模式下以 IE9 渲染，怪癖模式下以 IE5 渲染。和 IE9 模式不同的是，Emulate IE9 模式會考慮指令

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">

Emulate IE8 模式告訴 IE 使用指令來決定如果渲染文檔。標準模式下以 IE8 渲染，怪癖模式下以 IE5 渲染。和 IE8 模式不同的是，Emulate IE8 模式會考慮指令

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8">

Emulate IE7 模式告訴 IE 使用指令來決定如果渲染文檔。標準模式下以 IE7 渲染，怪癖模式下以 IE5 渲染。和 IE7 模式不同的是，Emulate IE7 模式會考慮指令。對于大多數站點而言，這是首選的兼容模式

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">

IE5 模式告訴 IE7 是否以怪癖模式渲染文檔

<meta http-equiv="X-UA-Compatible" content="IE=5">

Edge 模式告訴 IE 以最高級模式渲染文檔，也就是任何 IE 版本都以當前版本所支持的最高級標準模式渲染，避免版本升級造成的影響。簡單的說，就是什么版本 IE 就用什么版本的標準模式渲染

<meta http-equiv="X-UA-Compatible" content="IE=edge">

使用以下代碼強制 IE 使用 Chrome Frame 渲染

<meta http-equiv="X-UA-Compatible" content="chrome=1">

提示 IE 用戶安裝 Google Frame
Google 官方提供了對 Google Frame 插件安裝情況的檢測，這里直接調用方法即可，如果檢測到 IE 并未安裝 Google Frame，則彈出對話框提示安裝。

<script src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script><script>CFInstall.check();</script>

最佳的兼容模式方案，結合考慮以上兩種：

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

參考資料：
Make IE awesome by turning it into Google Chrome
Defining Document Compatibility

生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈