再谈 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