什么是<meta超文本传输协议-Equiv="X-UA-兼容"的内容="IE=边缘">做什么?

如果一个网页以

<!DOCTYPE html><html><head><meta http-equiv="X-UA-Compatible" content="IE=edge">

如果页面以

<!DOCTYPE html><html><head><!-- without X-UA-Compatible meta -->

如果没有区别,我想我可以忽略X-UA-Compatible元标题,因为我只是希望它在所有IE版本中以最标准的模式呈现。

1437564 次浏览

2021年11月更新

由于这个答案已经有10多年的历史了,我的建议是完全放弃这个标签,除非你必须支持旧的传统浏览器。

2015年10月更新

这个答案是几年前发布的,现在这个问题真的应该是您是否应该考虑在您的网站上使用#0标签?,微软对其浏览器所做的更改(更多关于下面的内容)。

根据您支持的Microsoft浏览器,您可能不需要继续使用X-UA-Compatible标签。如果您需要支持IE9或IE8,那么我建议使用该标签。如果您只支持最新的浏览器(IE11和/或Edge),那么我会考虑完全放弃此标签。如果您使用Twitter Bootstrap并需要消除验证警告,则此标签必须按指定的顺序出现。下面的其他信息:


X-UA-Compatible元标记允许Web作者选择页面应该呈现为哪个版本的Internet Explorer。IE11对这些模式进行了更改;请参阅下面的IE11注释。Microsoft Edge,替换IE11的浏览器,仅在某些情况下尊重X-UA-Compatible元标记。请参阅下面的Microsoft Edge注释。

根据微软的说法,当使用X-UA-Compatible标签时,它应该在文档head中尽可能高:

如果您使用的是X-UA兼容的META标记,您希望将其放置在尽可能靠近页面HEAD顶部的位置。Internet Explorer开始使用最新版本解释标记。当Internet Explorer遇到X-UA兼容的META标记时,它会使用指定版本的引擎重新开始。这会影响性能,因为浏览器必须停止并重新开始分析内容。

以下是您的选择:

  • "IE=Edge"
  • "IE=11"
  • "IE=EmulateIE11"
  • "IE=10"
  • "IE=EmulateIE10"
  • "IE=9"
  • "IE=EmulateIE9
  • "IE=8"
  • "IE=EmulateIE8"
  • "IE=7"
  • "IE=EmulateIE7"
  • "IE=5"

为了尝试理解每个词的含义,以下是Microsoft提供的定义:

Internet Explorer支持多种文档兼容模式,这些模式启用不同的功能并可能影响内容的显示方式:

  • 边缘模式告诉Internet Explorer以可用的最高模式显示内容。对于Internet Explorer 9,这相当于IE9模式。如果Internet Explorer的未来版本支持更高的兼容性模式,则设置为边缘模式的页面将以该版本支持的最高模式显示。使用Internet Explorer 9查看时,这些页面仍将以IE9模式显示。Internet Explorer支持多种文档兼容模式,这些模式启用不同的功能并可能影响内容的显示方式:
  • IE11模式提供了对已建立和新兴行业标准的最高支持,包括HTML5、CSS3等。
  • IE10模式提供了对已建立和新兴行业标准的最高支持,包括HTML5、CSS3等。
  • IE9模式提供了对已建立和新兴行业标准的最高支持,包括HTML5(工作草案)、W3C级联样式表3级规范(工作草案)、可缩放矢量图形(SVG)1.0规范等。[编者注:IE 9不要支持CSS3动画]。
  • IE8模式支持许多已建立的标准,包括W3C级联样式表2.1级规范和W3C选择器API;它还为W3C级联样式表3级规范(工作草案)和其他新兴标准提供有限的支持。
  • 无论页面是否包含<! DOCTYPE>指令,IE7模式都会将内容呈现为Internet Explorer 7以标准模式显示的内容。
  • Emulate IE9模式告诉Internet Explorer使用<! DOCTYPE>指令来确定如何呈现内容。标准模式指令以IE9模式显示,怪癖模式指令以IE5模式显示。与IE9模式不同,Emulate IE9模式尊重<! DOCTYPE>指令。
  • Emulate IE8模式告诉Internet Explorer使用<! DOCTYPE>指令来确定如何呈现内容。标准模式指令以IE8模式显示,怪癖模式指令以IE5模式显示。与IE8模式不同,Emulate IE8模式尊重<! DOCTYPE>指令。
  • Emulate IE7模式告诉Internet Explorer使用<! DOCTYPE>指令来确定如何呈现内容。标准模式指令显示在Internet Explorer 7标准模式中,quirks模式指令显示在IE5模式中。与IE7模式不同,Emulate IE7模式尊重<! DOCTYPE>指令。对于许多网站来说,这是首选的兼容模式。
  • IE5模式将内容呈现为Internet Explorer 7以怪癖模式显示的内容,这与Microsoft Internet Explorer 5中内容的显示方式非常相似。

IE10注意:从IE10开始,quirks模式的行为与早期版本的浏览器不同。在IE9和早期版本中,quirks模式将网页限制为IE5.5支持的功能。在IE10中,quirks模式符合HTML5规范中指定的差异。

就个人而言,我总是选择http-equiv="X-UA-Compatible" content="IE=edge"元标记,因为旧版本有很多错误,我不希望IE决定进入“兼容性模式”并将我的网站显示为IE7 vs IE8或9。我总是喜欢最新版本的IE。

IE 11

微软

从IE11开始,边缘模式是首选的文档模式;它代表了对浏览器可用的现代标准的最高支持。

使用HTML5文档类型声明启用边缘模式:

<!doctype html>

边缘模式在Internet Explorer 8中引入,并在每个后续版本中都可用。请注意,边缘模式支持的功能仅限于呈现内容的特定浏览器版本支持的功能。

从IE11开始,文档模式已弃用,不应再使用,除非是临时使用。确保更新依赖于旧功能和文档模式的站点以反映现代标准。

如果您必须以特定的文档模式为目标,以便您的网站在返工时运行以支持现代标准和功能,请注意您使用的是过渡功能,可能在未来版本中不可用。

如果您当前使用x-ua兼容的标头来定位遗留文档模式,则您的站点可能无法反映IE11可用的最佳体验。

Microsoft Edge(与Windows 10捆绑的Internet Explorer的替代品)

关于IE“Edge”版本的X-UA-Compatible元标记的信息。从微软

引入“活”边缘文档模式

正如我们在2013年8月宣布的那样,我们将从IE11开始弃用文档模式。随着我们最新的平台更新,对旧版文档模式的需求主要限于企业级旧版Web应用程序。随着新的架构更改,这些旧版文档模式将与“活”边缘模式的更改隔离开来,这将有助于保证依赖这些模式的客户获得更高级别的兼容性,并帮助我们更快地推进Edge的改进。IE仍然会尊重Intranet站点、兼容性视图列表中的站点以及仅与企业模式一起使用时提供的文档模式。

公共Internet站点将使用新的Edge模式平台呈现(忽略X-UA兼容)。从现在开始,Edge是“活”文档模式,我们的目标是不再引入其他文档模式。

随着Microsoft Edge在大多数情况下不再支持文档模式的更改,Microsoft有一个工具来扫描您的网站以检查它是否有与Edge不兼容的代码。

Chrome=1 IE信息

还有chrome=1,您可以使用或与上述选项之一一起使用:<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">chrome=1用于Google的ChromeFrame,定义为:

GoogleChromeFrame是一个开源浏览器插件。安装了该插件的用户在浏览器中打开页面时可以访问GoogleChrome的开放Web技术和快速JavaScript引擎。

GoogleChromeFrame无缝增强了您在Internet Explorer中的浏览体验。它使用Google Chrome的渲染技术显示启用GoogleChromeFrame的网站,让您可以访问最新的HTML5功能以及Google Chrome的性能和安全功能,而不会以任何方式中断您通常的浏览器使用。

安装GoogleChromeFrame后,网络会变得更好,而无需考虑它。

但是要使该插件工作,您必须在X-UA-Compatible元标记中使用chrome=1

有关Chrome框架的更多信息,请参阅这里

备注: GoogleChrome框架仅适用于IE6到IE9,并于2014年2月25日退役。更多信息可以找到这里。感谢@mck的链接。

验证:

HTML5

只有在使用<meta http-equiv="X-UA-Compatible" content="IE=Edge">时,页面才会使用W3验证器进行验证。对于其他值,它会抛出错误:A meta element with an http-equiv attribute whose value is X-UA-Compatible must have a content attribute with the value IE=edge.换句话说,如果您有IE=edge,chrome=1,它将不会验证。我完全忽略这个错误,因为现代浏览器只是忽略了这行代码。

如果您必须拥有完全有效的代码,那么请考虑通过设置HTTP标头在服务端执行此操作。注意,Microsoft说,If both of these instructions are sent (meta and HTTP), the developer's preference (meta element) takes precedence over the web server setting (HTTP header).有关如何设置HTTP标头的更多详细信息,请参阅olibre的回答bitinn的回答

XHTML

只要标签正确关闭(即/> vs>),使用<meta http-equiv="X-UA-Compatible" content="IE=Edge" />时验证没有问题。

Twitter Bootstrap(V3及以下)

至少自2014年以来,Bootstrap团队一直强烈推荐此标签,Bootlint,twbs团队编写的linter在省略标签时继续抛出警告。linter区分警告和错误,因此省略此标签的严重性可能被认为是次要的。


有关X-UA-Compatible的更多信息,请参阅Microsoft的网站定义文档兼容性

有关IE支持的更多信息,请参阅caniuse.com

有关Twitter Bootstrap要求的更多信息,请参阅bootlint项目wiki页面

使用content=#1跳过其他X-UA-Compatible模式

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">--------------------------
  • 无兼容性图标
    IE9地址栏不显示兼容性视图按钮
    页面也不显示混乱的位置菜单,图像和文本框。

  • 功能
    在IE8上启用javascript::JSON.parse()需要此元标记
    (即使存在<!DOCTYPE html>

  • 正确性
    现代超文本标记语言/CSS/JavaScript的渲染/执行更有效(更好)。

  • 性能
    三叉戟渲染引擎应该在其边缘模式下运行得更快。


用法

用你的超文本标记语言

<!DOCTYPE html><html><head><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  • IE=edge意味着IE应该使用其渲染引擎的最新(边缘)版本
  • #0意味着如果安装了IE应该使用Chrome渲染引擎

或者更好地配置您的Web服务器:
(另见RiaD的回答

  • Apache像素线提出

    <IfModule mod_setenvif.c><IfModule mod_headers.c>BrowserMatch MSIE ieHeader set X-UA-Compatible "IE=Edge,chrome=1" env=ie</IfModule></IfModule><IfModule mod_headers.c>Header append Vary User-Agent</IfModule>
  • Nginx as proposed by Stef Pause

    server {#...add_header X-UA-Compatible "IE=Edge,chrome=1";}
  • Varnish proxy as proposed by Lucas Riutzel

    sub vcl_deliver {if( resp.http.Content-Type ~ "text/html" ) {set resp.http.X-UA-Compatible = "IE=edge,chrome=1";}}
  • IIS (since v7)

    <configuration><system.webServer><httpProtocol><customHeaders><add name="X-UA-Compatible" value="IE=edge,chrome=1" /></customHeaders></httpProtocol></system.webServer></configuration>

Microsoft recommends Edge mode since IE11

As noticed by Lynda (see comments), the Compatibility changes in IE11 recommends Edge mode:

Starting with IE11, edge mode is the preferred document mode;it represents the highest support for modern standards available to the browser.

But the position of Microsoft was not clear. Another MSDN page did not recommend Edge mode:

Because Edge mode forces all pages to be opened in standards mode,regardless of the version of Internet Explorer,you might be tempted to use this for all pages viewed with Internet Explorer.Don't do this, as the X-UA-Compatible header is only supported startingwith Windows Internet Explorer 8.

Instead, Microsoft recommended using <!DOCTYPE html>:

If you want all supported versions of Internet Explorer to openyour pages in standards mode, use the HTML5 document type declaration [...]

As Ricardo explains (in the comments below) any DOCTYPE (HTML4, XHTML1...) can be used to trigger Standards Mode, not only HTML5's DOCTYPE. The important thing is to always have a DOCTYPE in the page.

Clara Onager has even noticed in an older version of Specifying legacy document modes:

Edge mode is intended for testing purposes only;do not use it in a production environment.

It is so confusing that Usman Y thought Clara Onager was speaking about:

The [...] example is provided for illustrative purposes only;don't use it in a production environment.

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

在这个答案的其余部分,我给出了更多的解释,为什么在生产中使用content="IE=edge,chrome=1"是一个很好的实践。


历史

多年来(2000年至2008年),IE市场份额超过80%和IEv6被认为是事实上标准(2003的市场份额为80%至97%,仅IE6为2004、2005和2006年,所有IE版本的市场份额更多)。

由于IE6不尊重web标准,开发人员使用IE6测试他们的网站。这种情况对微软(MS)来说很好,因为网络开发人员必须购买 MS产品(例如IE不能在不购买Windows的情况下使用),保持不合规更赚钱(即微软想成为标准,不包括其他公司)。

因此,许多网站仅符合IE6标准,而由于IE不符合Web标准,所有这些网站都没有在符合标准的浏览器上很好地呈现。更糟糕的是,许多网站只需要IE

然而,在这个时候,Mozilla开始了Firefox开发,尽可能尊重所有的Web标准(其他浏览器实现了IE6的页面渲染)。随着越来越多的Web开发人员想要使用新的Web标准功能,越来越多的网站比IE更支持Firefox。

当IE市场份额下降时,MS意识到保持标准不兼容不是一个好主意。因此MS开始发布新的IE版本(IE8/IE9/IE10),以尊重越来越多的Web标准。


网络不兼容问题

但问题是所有为IE6设计的网站:微软无法发布与这些旧的IE6设计的网站不兼容的新IE版本。微软没有推断出网站的IE版本,而是要求开发人员在他们的页面中添加额外的数据(X-UA-Compatible)。

2016年仍在使用IE6

如今,IE6仍然使用(2016年为0.7%)(2014年1月为4.5%),一些互联网网站仍然只符合IE6。一些内部网网站/应用程序使用IE6进行测试。一些内部网网站仅在IE6上100%正常运行。这些公司/部门宁愿推迟迁移成本:其他优先事项,没有人再知道网站/应用程序是如何实现的,遗留网站/应用程序的所有者破产了…

中国在2013年占IE6使用量的50%,但在未来几年可能会改变为中文Linux正在播出

对您的网络技能充满信心

如果您(尝试)尊重Web标准,您可以简单地始终使用http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"。为了保持与旧浏览器的兼容性,请避免使用最新的Web功能:使用您想要支持的最旧浏览器支持的子集。或者如果您想更进一步,您可以采用优雅的退化逐步增强不显眼的JavaScript的概念。(您可能也很高兴阅读Web开发人员应该考虑什么?。)

不要关心最好的IE版本渲染:这不是你的工作,因为浏览器必须符合Web标准。如果您的网站符合标准并使用适度的最新功能,因此浏览器必须符合您的网站

此外,由于有许多活动杀死 IE6(不再是IE6MS活动),现在你可以避免浪费时间与IE测试!

个人IE6体验

在2009-2012年,我在一家使用IE6作为允许官方单一浏览器的公司工作。我必须仅为IE6实现一个Intranet网站。我决定尊重Web标准,但使用支持IE6的子集(超文本标记语言/CSS/JS)。

这很难,但当公司切换到IE8时,网站仍然呈现良好,因为我使用了Firefox和萤火虫来检查Web标准兼容性;)

使用它来强制IE隐藏地址栏中烦人的浏览器兼容性按钮:

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

我认为微软的这张图说明了一切。为了告诉IE如何渲染内容,!DOCTYPE必须使用X-UA-Com不必兼容的元标记。!DOCTYPE本身对更改IE文档模式没有影响。

在此处输入图片描述

http://ie.microsoft.com/testdrive/ieblog/2010/Mar/02_HowIE8DeterminesDocumentMode_3.png

只是为了完整性,您实际上不必将其添加到您的超文本标记语言(在HTML5中是未知的超文本传输协议-Equiv)

这样做,永远不要回头看(第一个例子apache,第二个例子nginx

Header set X-UA-Compatible "IE=Edge,chrome=1"
add_header X-UA-Compatible "IE=Edge,chrome=1";

如果您在与服务器相同的网络中使用您的网站,IE喜欢切换到兼容模式,尽管DOCTYPE。
添加meta http-equiv="X-UA-Compatible" content="IE=Edge"禁用这个不需要的行为。

不同之处在于,如果您只指定DOCTYPE,则IE的兼容性视图设置优先。默认情况下,这些设置强制所有Intranet站点进入兼容性视图,无论DOCTYPE如何。还有一个复选框可用于所有网站,无论DOCTYPE如何。

IE兼容性视图设置对话框

X-UA-Compatible覆盖兼容性视图设置,因此无论浏览器设置如何,页面都将以标准模式呈现。这强制标准模式为:

  • 内网页面
  • 当计算机管理员选择“在兼容性视图中显示所有网站”作为默认值时,外部网页-想想大公司,政府,大学
  • 当你无意中在Microsoft兼容性视图列表结束
  • 用户在兼容性视图设置中手动将您的网站添加到列表中的情况

DOCTYPE无法做到这一点;在这些情况下,无论DOCTYPE如何,您最终都会进入兼容性视图模式之一。

如果同时指定了meta标记和HTTP标头,则meta标记优先。

此答案基于检查IE8IE9IE10中决定文档模式的完整规则。请注意,查看DOCTYPE是决定文档模式的最后退步。

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

要使这条线按预期工作,请确保:

  1. 它是<head>之后的第一个元素
  2. 在元标记之前使用否条件注释,例如。在<html>元素上

否则,一些IE版本会忽略它。

更新

这两个规则被简化了,但它们很容易记住和验证。尽管MSDN文档说明您可以将标题和其他元标记放在这个之前,但我不建议这样做。

如何使用条件注释。

关于头部元素顺序的有趣文章。(blogs.msdn.com,IE)

参考

MSDN留档

X-UA-Compatible[…]必须出现在网页的标题中(HEAD部分)在除了title元素和其他meta元素之外的所有其他元素之前。

由于我不能对标记的答案添加评论,我将在这里发布。

除了正确的答案之外,您确实可以验证这一点。由于此元标记仅针对IE,您需要做的就是添加一个IE条件。

<!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"><![endif]-->

这样做就像添加任何其他IE条件语句一样,只适用于IE,不会影响其他浏览器。

这是字面意思是1个谷歌查询,但这里有:

http://msdn.microsoft.com/en-us/library/jj676915(v=vs.85). aspx

了解遗留文档模式

使用以下值以边缘模式显示网页,即Internet Explorer支持的最高标准模式,从Internet Explorer 6到IE11。

<meta http-equiv="x-ua-compatible" content="IE=edge"

说明,这在功能上等同于使用HTML5 doctype。它将Internet Explorer置于最高支持的文档模式。边缘最适合定期维护定期测试之间的互操作性的网站多个浏览器,包括Internet Explorer。

注释从IE11开始,边缘模式被认为是首选的文档模式。(在早期版本中,它被认为是实验性的。)要了解更多信息,请参阅不建议使用文档模式。从Windows Internet Explorer 8,一些Web开发人员使用边缘模式元元素隐藏地址栏上的兼容性视图按钮。从IE11开始,这不再是必要的,因为按钮已被删除从地址栏。因为它强制打开所有页面标准模式下,无论Internet Explorer的版本如何,您可能会尝试对使用Internet查看的所有页面使用边缘模式不要这样做,因为X-UA兼容标头仅支持从Internet Explorer 8开始。

小贴士如果您希望所有受支持的Internet Explorer版本都以标准模式打开您的页面,请使用HTML5文档类型声明,如前面的示例所示。

搜索结果中还有:

只说一句话指示Internet Explorer使用其最新的渲染引擎

<meta http-equiv="x-ua-compatible" content="ie=edge">

2.1.3.5X-UA兼容性元标记和HTTP响应标头

此功能不会在任何版本的Microsoft Edge中实现。

<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE" />

https://msdn.microsoft.com/en-us/library/ff955275(v=vs.85)

是的,我知道我迟到了,但我只是有一些问题和讨论,最后我的老板让我从我一直在处理的所有文档中删除X-UA-Compatible标签。

如果此信息已过时或不再相关,请更正。