X-UA-Compatible设置为IE = edge，但仍不会停止兼容模式

247

我很困惑。我应该可以设置

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

IE8和IE9应该使用最新的渲染引擎来渲染页面。但是，我只是对其进行了测试，并且如果在我们网站的其他位置启用了兼容模式，即使我们强迫不要这样做，该模式也将保留在我们的页面上。

怎么是你应该确保IE浏览器没有（甚至在企业内部网）使用兼容模式？

FWIW，我正在使用HTML5 DocType声明（<!doctype html>）。

这是页面的前几行：

<!doctype html> 
<!--[if lt IE 7 ]> <html lang="en" class="innerpage no-js ie6"> <![endif]--> 
<!--[if IE 7 ]>    <html lang="en" class="innerpage no-js ie7"> <![endif]--> 
<!--[if IE 8 ]>    <html lang="en" class="innerpage no-js ie8"> <![endif]--> 
<!--[if (gte IE 9)|!(IE)]><!--> 
<html lang="en" class="innerpage no-js"> 
<!--<![endif]--> 
    <head> 
        <meta charset="ISO-8859-1" /> 
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />

编辑：我刚刚了解到 IE8的默认设置是对Intranet网站使用IE7兼容模式。这会覆盖X-UA-Compatible元标记吗？

internet-explorer  ie8-compatibility-mode  x-ua-compatible 
— 克里克
source
我的一些用户也遇到了这个问题，您有没有解决？我的应用程序不是Intranet。奇怪的是，只有20％的用户得到了它。
— 凯文
2
这可能是您有趣的<html>标记标记（<！-[如果是IE 7]>的结果）的结果。尝试将其删除，看看是否可行。见这太问题stackoverflow.com/questions/10682827/...
— 周日千斤
13
@SundayIronfoot仅供参考，您引用的有趣的<html>标签标记是有条件的IE注释，用于将IE类的CSS类添加到<html>元素（如果适用），以便您可以根据需要更改样式对于IE版本，只需在样式声明的前面加上“ .ie7”即可，例如：.ie7 p {width：200px; 与旧版IE相比，这比使用* width或_width之类的CSS hack来的渲染问题更清洁。IE以外的浏览器将忽略它，而仅使用基本的浏览器。
— 蒂姆·富兰克林

Answers:

261

如果您需要为Intranet网站覆盖IE的“兼容性视图设置”，则可以在web.config（IIS7）中或通过网站属性（IIS6）中的自定义HTTP标头进行设置，并在其中设置X-UA-Compatible。元标记不会覆盖“兼容性视图设置”中的IE的Intranet设置，但如果在托管服务器上进行设置，它将覆盖兼容性。

IIS7中的web.config示例：

<system.webServer>
    <httpProtocol>
      <customHeaders>
        <add name="X-UA-Compatible" value="IE=EmulateIE8" />
      </customHeaders>
    </httpProtocol>
</system.webServer>

编辑：我clear从之前删除了代码add；这是复制和粘贴过程中不必要的监督。好收获，评论员！

— 蒂姆·富兰克林
source
5
不过，请注意...如果您正在使用内置的Visual Studio开发Web服务器（也称为Cassini）进行开发，则此操作将不起作用，因为Cassini不遵守Web的<system.webServer>部分。配置。因此，对于开发，请改用IIS Express。
— 詹姆斯·梅辛格
1
是什么原因<clear />？这样会清除哪些自定义标头？
— M4N 2012年
清除似乎<urlCompression...>至少对我来说是一条规则。该规则确实会压缩，因此我将其注释掉。任何进一步的信息将是可爱的。
— Nenotlep
我删除了“清除”-很好，这是从实现中复制和粘贴的不必要的一行。
— 蒂姆·富兰克林
14
PHP：<?php header('X-UA-Compatible: IE=edge'); ?>
— Nux
183

服务器端解决方案是推荐的解决方案，如@TimmyFranks在其答案中建议的那样，但是如果需要X-UA-Compatible在页面级别实施该规则，请阅读以下提示，以充分利用已经被烧死的那个的经验。

该X-UA-Compatiblemeta标签必须出现在标题后直接<head>元素。不能在其之前放置其他元标记，css链接和js脚本调用。

<head>
    <title>Site Title</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <script type="text/javascript" src="/jsFile.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="apple-touch-icon" href="https://stackoverflow.com/apple-touch-icon.png" />
    <link rel="shortcut icon" href="https://stackoverflow.com/apple-touch-icon.png" />
</head>

如果页面中有任何条件注释（假设位于中<html>），则必须将其放在下方<head>。

// DON'T: place class inside the HTML tag 
<!--[if gt IE 8]><!--> 
    <html class="aboveIe8"> 
<!--<![endif]-->

// DO: place the class inside the BODY tag
<!--[if gt IE 8]><!--> 
    <body class="aboveIe8"> 
<!--<![endif]-->

Html5BoilerPlate的团队写了这个bug - http://h5bp.com/i/378 他们有几个解决方案。

关于Intranet和兼容性视图，当您转到工具>兼容性视图设置时，会有一些设置。

兼容性视图设置

— 新世界
source
1
我已经在Stack Overflow上尝试了4个或5个其他答案，只有这种特定的组合对我有用。对于使用WordPress和SEO插件的任何人，请小心该插件在其他位置重写<title>。编辑：添加了WordPress评论
— Mike Ebert
6
X-UA-Compatible应该尽早出现，可能在之后出现charset。我认为“必须在标题后立即出现”是不对的。
— 2013年
此建议是由于IE遭受苦难的结果。被鲜血所吸引。谁说IE遵循准则？
— neoswf 2013年
4
哇，这对我有用，并且在标题标签之后紧紧放置了我的meta标签就是了。希望做这项工作不是那么古老...
— TheJerm 2014年
该X-UA-Compatible元标记后出现title，base并没有失去它的作用任何其他meta标签。这是我在IE8中测试的。但是，不能在其前面加上任何条件注释。
— Rockallite's
37

请注意，如果从PHP提供服务，则也可以使用以下代码对其进行修复。

header("X-UA-Compatible: IE=Edge");
— TJ L
source
4
这比添加meta标签更好，因为它使用此方法通过W3C验证，并且比.htaccess hack容易得多。
— Talvi Watia 2012年
2
我尝试了其他所有方法，这才最终奏效。谢谢。
— 杰森
2
对于使用WordPress的用户来说，这可能会有所帮助：codex.wordpress.org/Plugin_API/Action_Reference/send_headers
— ambiguousmouse
当构建一个庞大的站点时，这也要好得多<!--[if lt IE 7 ]> <html>...！谢谢！你是上帝送的！
— OZZIE 2014年
2
@sunskin-PHP发送的任何标头必须发生在将任何输出发送到页面之前，即在PHP输出任何HTML或数据之前。
— TJ L
25

事实证明，这与Microsoft的“智能”选择有关，以使所有Intranet站点强制进入兼容模式，即使将X-UA-Compatible其设置为IE=edge。

— 克里克
source
32
这不是真的。X-UA-Compatible将覆盖兼容模式设置。但是，有时无法使用meta标签，因为该模式在遇到它时就已经设置好了。这就是为什么我使用HTML标头版本，因此浏览器可以在此过程的早期启用标准模式的原因。
— Erik Funkenbusch 2012年
3
除了Mystere Man的注释之外，您还可以使用web.config或IIS中的自定义http标头从托管服务器覆盖它。有关详细信息，请参见上面的我的帖子。
— 蒂姆·富兰克林
7
我已经尝试了多次，它不会覆盖所有强制为可比模式的Intranet站点。
— 2013年
@Mystere Man：有时将定义为页面位于iframe中的任何时候，其中父文档未定义XUA-COMPAT，并且文档模式从父页面继承（另一种非常明智的MS选择）。
— Stefan Steiger
1
@Kerrick：这不是正确的答案。请参阅下面由tj111回答的以下内容以获得正确答案。
— 退化
9

在本地主机的IE7文档标准中，我也遇到了相同的IE9渲染问题。我尝试了许多条件注释标签，但未成功。最后，我只是删除了所有条件标签，并在如下所示的头部之后立即添加了meta标签，它的工作方式就像是魅力。

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

希望能帮助到你

— 普拉莫德
source
7

即使您取消选中“在兼容性视图中显示Intranet站点”选项，并且在响应标题中具有X-UA-Compatible，您的浏览器还是可能会默认使用“兼容性视图”-组策略。在控制台上查看以下消息：

HTML1203：xxx.xxx已配置为通过组策略在兼容性视图中运行。

其中xxx.xxx是您网站的域（即test.com）。如果看到此消息，则将设置您域的组策略，以便任何以test.com结尾的网站都将自动以兼容模式呈现，而不管文档类型，标头等如何。

有关更多信息，请参见以下链接（解释html代码）：http : //msdn.microsoft.com/zh-cn/library/ie/hh180764 (v=vs.85) .aspx

— 沙德曼
source
5

正如NEOSWF在上面指出的那样，Paul Irish条件注释使meta标签停止起作用。

这里有所有修复程序（http://nicolasgallagher.com/better-conditional-classnames-for-hack-free-css/）

这些包括：

使用服务器标头添加两个HTML类，并在doctype上方添加条件注释。

在我的最新项目中，我决定删除Paul Irish条件注释。我不喜欢在html之前添加任何内容而不先做很多测试的想法，很高兴看到仅通过查看HTML设置了什么。

最后，我在身体后面直接围着一个div，并使用了条件注释，例如

  <!--[if IE 7]><div class="ie7"><!--<![endif]-->
  ... regular body stuff
  <!--[if IE 7]></div><!--<![endif]-->

我本来可以做到这一点，但是使用Wordpress等CMS则比较困难。

显然，它是标记内的另一个DIV，但仅适用于较旧的浏览器。

我认为这可能是基于每个项目的决定。

我还阅读了一些有关charset meta标记的信息，该标记必须位于前1024个字节中，因此可以确保这一点。

有时，最简单，最容易阅读的想法是最好的，绝对值得考虑！感谢上面链接的第六条评论指出这一点。

— 用户名
source
5

X-UA-Compatible仅覆盖文档模式，不覆盖浏览器模式，并且不适用于所有Intranet站点；如果是这种情况，最好的解决方案是禁用“在兼容性视图中显示Intranet站点”并设置组策略设置以指定哪些Intranet站点需要兼容模式。

— 托尼
source
5

我将以下内容添加到我的htaccess文件中，该文件可以成功实现：

BrowserMatch MSIE ie
Header set X-UA-Compatible "IE=Edge,chrome=1" env=ie
— 梅兹
source
1
当Intranet设置为兼容性时，此功能有效。我花了很长时间才找到可行的方法。特别是当您搜索并且一切都与iis相关时
— shorif2000
这太棒了。我不知道您可以使用.htaccess发送标头
— Alex W
3

此外，X-UA兼容必须是头部中的第一个meta标签

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

顺便说一句，正确的顺序或主要的头标签是：

<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta charset="utf-8">
    <title>Site Title</title>
    <!-- other tags -->
</head>

这条路

  1. 我们将渲染引擎设置为在IExplorer开始处理之前使用
  2. 然后我们将文档设置为用于所有浏览器的编码
  3. 然后我们打印标题，将使用已经定义的编码进行处理。
— 莱昂纳多·莫利纳
source
2
实际上，CHARSET应该在X-UA兼容之前。见blogs.msdn.com/b/ieinternals/archive/2011/07/18/...
— EricLaw
1
它不一定要是第一个，但确实需要在顶部附近。它可以跟随标题（和字符集，如Eric所述），但是仅此而已。
— Lance Leonard 2014年
就我而言，在nginx上，只有X-UA-Compatible-tag是头部中的第一个标签时，它才起作用
— Marco Roth
2

蒂米·弗兰克斯（Timmy Franks）适合我。今天我们刚遇到一个问题，即客户端在公司范围内拥有IE8，这迫使我们为其Intranet编写的网站进入兼容模式。设置“ IE-Edge”似乎可以解决该问题。

<httpProtocol>
  <customHeaders>
    <clear />
    <add name="X-UA-Compatible" value="IE=Edge" />
  </customHeaders>
</httpProtocol>
— 南肖克
source
1

IE 11不允许您再通过发送标头来覆盖浏览器兼容性视图设置...

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

强制浏览器不使用兼容性视图的唯一方法是让用户在其浏览器中禁用它。我们是一个Intranet站点，默认的IE选项是对Intranet站点使用兼容性视图。真痛苦！

我们能够防止用户更改IE 9和10用户的浏览器设置，但是在IE 11中不再起作用。我们的IE用户正在切换到Chrome，这不是问题，而且从来没有是。

— 埃里克
source
不是因为它不允许这样IE11做，也不支持除以外的其他兼容模式edge。链接到官方文档。这意味着我们不必再使用该元标记来隐藏地址栏上的CM按钮。
— 华莱士·西德雷（WallaceSidhrée）2014年
4
不正确：IE11仍支持所有旧版兼容模式。
— EricLaw 2014年
@ EricLaw，EricP的答案是否正确（IE11更改了X-UA兼容HTTP标头的行为）？
— 马修·弗莱申
@EricP，您尝试使用HTTP标头还是仅使用<meta>标记版本？
— Matthew Flaschen
2
@MatthewFlaschen：不，EricP是不正确的，华莱士·西德瑞（Wallace Sidhree）也是不正确的（尽管对华莱士很公平，但MSDN并未解释“过时”的含义）。IE11中发生的变化是根本没有可见的“兼容性视图”按钮（technet.microsoft.com/zh-cn/library/dn321449.aspx），但仍遵守X-UA-Compatible声明。
— EricLaw 2014年
1

我能够解决在使用PHP的HTML之前加载标头的问题，并且效果很好。

<?php 
header( 'X-UA-Compatible: IE=edge,chrome=1' );
header( 'content: width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no' );
include('ix.html');
?>

ix.html是我要在发送标头后加载的内容。

— 用户名
source
1

我在IE11中遇到同样的问题。这些答案都不能解决我的问题。稍作研究后，我注意到浏览器正在企业模式下运行。（通过单击F12进行验证，然后单击“仿真”选项卡，查找浏览器配置文件的下拉列表）设置已锁定，不允许我更改设置。

从以下注册表项中删除CurrentVersion后，可以将配置文件更改为桌面：

HKEY_CURRENT_USER\Software\Policies\Microsoft\Internet Explorer\Main\EnterpriseMode

将模式更改为桌面后，此帖子上的答案将起作用。

— 杰法塔尔
source
1

当您的浏览器以兼容模式打开时，即使您从Web浏览器和本地组策略编辑器中删除并关闭了所有兼容模式配置，也可以尝试禁用注册密钥。

在使用域和子域连接服务器端时，我也会遇到这种情况。该计算机仅限于以兼容模式打开所有子域。

禁用Intranet的兼容模式

HKEY_LOCAL_MACHINE-软件-策略-Microsoft-Internet Explorer-BrowserEmulation-> IntranetCompalityMode值应为0（零）。并从PolicyList中删除现有域名。

否则，您可以添加包含0（零）值数据的新值（DWORD）。

— Ayciceksamet
source
0

尝试了多种组合后出现了相同的问题，我得到了这个工作说明，并检查了Intranet的兼容性 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<head runat="server">
— 卡帕德曼
source
0

如果使用的是LAMP堆栈，则将其添加到Web根文件夹中的.htaccess文件中。无需将其添加到每个PHP文件中。

<IfModule mod_headers.c>
    Header add X-UA-Compatible "IE=Edge"
</IfModule>
— 凯文·史密斯
source
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.