What is the role of adding x-ua-compatible and ie=edge,chrome=1 in HTML meta?

X-ua-compatible is a setting that has been added since IE8 and is not recognized for browsers below IE8.
You can specify the compatibility mode setting for a Web page by setting the value of x-ua-compatible in Meta.

The mode precedence specified in the Web page is higher than the mode specified in the server (via HTTP Header).
Compatibility Mode Setting Priority:

1	Meta tag > http header

Examples of common use:

12345678910

<meta http-equiv="x-ua-compatible" content="ie=7"> #以上代码告诉IE浏览器, IE8/9 will render the page with the IE7 engine, regardless of whether the document standard is declared with a DTD. <meta http-equiv="x-ua-compatible" content="Ie=8"> #以上代码告诉IE浏览器, IE8/9 will render the page with the IE8 engine. <meta http-equiv="x-ua-compatible" content="Ie=edge"> #以上代码告诉IE浏览器, IE8/9 and later versions will render pages with the highest version of IE. <meta http-equiv="x-ua-compatible" content="Ie=7,ie=9"> #将IE8和IE7按照IE7标准渲染, but IE9 is still rendered according to IE9 's standard. It allows for different backwards compatibility levels. <meta http-equiv="x-ua-compatible" content="ie=7,9"> <meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1"> #以上代码IE=edge tells IE to render the page using the latest engine, chrome=1 can activate the chrome Frame.

Google Chrome Frame Encyclopedia

"Ie=edge,chrome=1″ is quick and easy, but the downside is that the code will not be able to pass the test. In fact, this is not a problem, after all, the standard is only standard, if only this one "error" will not have any adverse effect.

All possible values for IE document compatibility mode:

123456

emulate IE8 mode #指示IE使用 <! doctype> instructions to determine how to compile the content. The Standards Mode command is displayed as IE8 standards mode and quirks mode is displayed as IE5 mode. Different from IE8 mode,emulate IE8 mode takes <! seriously doctype> instructions. emulate IE7 mode #指示IE使用 <! doctype> instructions to determine how to compile the content. The Standards Mode command is displayed as IE7 standards mode and quirks mode is displayed as IE5 mode. Different from IE7 mode,emulate IE7 mode takes <! seriously doctype> instructions. This is the most recommended compatibility mode for many Web pages. IE5 mode #编译内容如同IE7的quirks mode display, very similar to that shown in IE5. IE7 mode #编译内容如同IE7的standards mode display, regardless of whether the webpage contains <! doctype> instructions. IE8 mode #提供对业界标准的最高支持, including the cascading Style Sheets Level 2.1 specification and the selectors API, and limited support Cascading Style Sheets Level 3 specification (working Draft). Edge mode #指示IE以目前可用的最高模式显示内容. When using IE8, it is equivalent to IE8 mode. if (assuming) future releases of IE that support a higher compatibility mode, pages using edge mode will display content using the highest mode supported by that version. The same pages will still be displayed as usual when browsing with IE8.

Precautions:
1, according to the official website definition x-ua-compatible header is not case-sensitive; However, it must appear in the Web page before all other elements except the title element and other meta elements. If not, it doesn't work.
2,content content is ie=8, or Ie=edge equivalent, note is not IE8 or directly write the value of edge, otherwise does not work

If you know about the Web server, you can configure VirtualHost directly:
Apache:

12345678

<ifmodule mod_setenvif. C> <ifmodule mod_headers. C> browsermatch MSIE ie Header set X-UA-Compatible "Ie=edge" env=IE browsermatch chromeframe GCF Header append X-UA-Compatible "chrome=1" env=gcf< /c14> </ifmodule> </ifmodule>

Nginx: Detailed Reference: Example

1	Add_header "x-ua-compatible" " ie=edge,chrome=1";

Reference:
http://lightcss.com/add-x-ua-compatible-meta-to-your-website/
http://desert3.iteye.com/blog/1638591

What is the role of adding x-ua-compatible and ie=edge,chrome=1 in HTML meta?