一个网站如果做好了浏览器的兼容，不仅能够让其在不同的浏览器下都能正常显示，也能够抓住更多的网站访客，提高用户体验。通过在meta中设置X-UA-Compatible的值，可以指定网页的兼容性模式设置。
1 通过在meta中设置X-UA-Compatible的值，可以指定网页的兼容性模式设置
X-UA-Compatible是针对IE8新加的一个设置，用于为 IE8 指定不同的页面渲染模式，对于IE8之外的浏览器是不识别的。
在IE8刚推出的时候，很多网页由于重构的问题，无法适应较高级的浏览器，所以使用X-UA-Compatible标签强制IE8采用低版本方式渲染。
由于当下低版本的IE使用率依然较高，综合考虑，启用 IE8 版本的 X-UA-Compatible 兼容模式显得相当重要。
在网页中指定的模式优先权高于服务器中(通过HTTP Header)所指定的模式。所以，为了避免制作出的页面在IE8下面出现错误，可以在页面的header的meta标签中写入代码来实现浏览器的兼容。
需要注意的是：当Internet Explorer遇到 X-UA-Compatible 的meta标记时，它会使用指定版本的引擎重新启动。这是一个性能损失，因为浏览器必须停止并重新开始分析内容。
2 常用的浏览器兼容模式配置
ref：https://zccst.iteye.com/blog/2162187
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" />
开启 IE8 的标准渲染模式，但由于本身 X-UA-Compatible 文件头仅支持 IE8 以上版本，因此等同于冗余代码。
4.<meta http-equiv="X-UA-Compatible" content="edge" />
Edge 模式通知 Windows Internet Explorer 以最高级别的可用模式显示内容，这实际上破坏了“锁定”模式。即如果你有IE9的话说明你有IE789，那么就调用高版本的那个也就是IE9，页面不会进入quirks模式。
5.<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" >
-
IE=edge意味着IE应该使用其渲染引擎的最新版本 -
chrome=1表示IE应该使用Chrome渲染引擎（如果已安装）
（如果IE有安装Google Chrome Frame，那么就走安装的组件，如果没有就和<meta http-equiv="X-UA-Compatible" content="edge" />一样。）
说明：针对IE 6，7，8等版本的浏览器插件Google Chrome Frame，可以让用户的浏览器外观依然是IE的菜单和界面，但用户在浏览网页时，实际上使用的是Google Chrome浏览器内核。
6.<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
EmulateIE7 模式通知 Windows Internet Explorer 使用 <!DOCTYPE> 指令确定如何呈现内容。标准模式指令以Windows Internet Explorer 7 标准模式显示，而 Quirks 模式指令以 IE5 模式显示。与 IE7 模式不同，EmulateIE7 模式遵循 <!DOCTYPE> 指令。对于多数网站来说，它是首选的兼容性模式。
目前，在开发AngularJS项目时（只支持IE8及以上版本或chrome/firefox），而有些人IE8登录却还提示“请使用IE8及以上版本或chrome/firefox，如果您使用IE8，请在”工具”菜单中，调整为非”兼容性视图”！
网友评论