如何在IE中禁用兼容性视图

77

我想知道如何阻止使用IE 8的用户进入兼容性模式?

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

我发现这个标签,我认为它会强制人们保持IE-8模式,但我不太确定,因为我没有IE 9,无法进行检查。

如果用户处于IE 9模式下,我是否应该强制他们不要进入IE 8或IE 7兼容模式?

我尝试将上述代码行放入我的代码中,然后转到IE 9 -> 工具 -> 兼容性视图(灰色),但"兼容性视图设置"没有变灰,并且似乎可以通过那里添加该网站。

那么它应该不会被禁用吗?


15
@Sparky672 - 是的,我会这么做。我不支持IE 7,并显示浏览器已过时警告。通过可用性研究,我发现大多数人并不知道他们可能处于兼容模式中(并且实际上也没有设置它),当你告诉他们他们的浏览器已经过时,并且他们认为他们正在使用IE8(在研究进行时是最新的浏览器),他们会非常快地感到困惑。最好的解决方案是强制将他们返回到IE 8/9(他们可能认为自己已经在运行的浏览器版本)。 - chobo2
8个回答

91

您所需要做的就是强制在IE中禁用C.M. - 只需粘贴此代码(在IE9及以下版本中,c.m.将被禁用):

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

来源: http://twigstechtips.blogspot.com/2010/03/css-ie8-meta-tag-to-disable.html

此文介绍如何利用CSS和meta标签防止Internet Explorer 8(IE8)以前的版本进入Quirks Mode,从而保持网页渲染一致性。

3
这个对我在使用 Twitter Bootstrap 和 IE 浏览器兼容性方面非常有帮助。请注意,这应该是第一个元标签。 - nope_four
11
这不就是与 <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 相同的吗? - eug
4
请注意不要在此标签前使用任何条件注释。否则它将无法工作!在这里找到提示:https://dev59.com/ZnA75IYBdhLWcg3wJFiY#XqaeEYcBWogLw_1b9Cw- - Karl Adler

74

这应该足以强制任何IE版本的用户退出兼容模式:

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

然而,以下有几个需要注意的地方:

  • 上述meta标签应作为<head>下的第一个标签。只有<title>标签可以放在它之前。

如果您不这样做,在 IE9 开发工具中会收到错���提示:X-UA-Compatible META tag ignored because document mode is already finalized.

  • 如果您想使此标记有效,请确保使用 /> 而不是仅仅 > 来关闭 meta 标签。

  • IE11 开始,边缘模式是首选文档模式。为了支持/启用它,请使用 HTML5 文档类型声明 <!doctype html>

  • 如果您需要在 IE7 上支持 Web 字体,请确保使用 <!DOCTYPE html>。我已经测试过,发现在使用 <!doctype html> 时, 在IE7上呈现 Web 字体变得相当不可靠。

使用 Google Chrome Frame 很受欢迎,但不幸的是,它将在2014年1月被取消。

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

这里有广泛相关的信息,在此处。将其用作第一个 meta 标签的提示在之前提到的来源这里已经更新。


我没有看到“X-UA-Compatible META标签被忽略”的消息,但它使用IE7模式。当我将此标签向上移动时 - 大多数情况下它使用IE11,但有时仍然是IE7。 - Maxim Mazurok

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

这个标签应该可以强制页面在IE8标准模式下渲染。用户可能会将站点添加到兼容性列表中,但此标签将优先生效。

一个快速检查的方法是加载页面并在地址栏输入以下内容:

javascript:alert(navigator.userAgent) 

如果字符串中包含IE7,则它以兼容模式加载,否则不会。


2
如果他们使用IE 9,会将其设置为IE 8吗? - chobo2
1
如果用户在IE9中使用它,它将以IE8标准模式显示。您还可以在IE9中使用F12开发人员工具栏进行验证。 - Sriranga Chidambara
92
最好使用<meta http-equiv="X-UA-Compatible" content="IE=edge" />。此外,如果网站托管在微软认为是“Intranet”的地方,您将无法更改兼容性视图。唯一的方法是在工具 - 兼容性视图设置中取消选中“在Intranet站点中显示兼容性视图”复选框。IE8+中的默认设置真的很糟糕。 - oldwizard
5
我同意。刚被“在兼容性视图中显示内部网站”默认设置(在我的情况下是IE9)所困扰。 - Derek Morrison
4
我已经勾选了“在兼容性视图中显示Intranet站点”的选项,但X-UA-Compatible元标记似乎覆盖了它。 - Justin Skiles
显示剩余3条评论

9
如果您正在使用ASP.NET MVC,我发现在_Layout中的代码块中使用Response.AddHeader("X-UA-Compatible", "IE=edge,chrome=1")非常有效:
@Code
    Response.AddHeader("X-UA-Compatible", "IE=edge,chrome=1")
End Code
<!DOCTYPE html>
everything else

5

FelixFett提供的答案对我有用。重申一下:

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

我已将其作为代码中的第一个“meta”标签。我添加了10和11,因为这些是现在发布的Internet Explorer版本。
我本来想在他的回答上发表评论,但我的声望不够高...

3
在Apache中实现这一点的另一种方法是将以下行放入您网站的根文件夹(或Apache配置文件)中的.htaccess中。
BrowserMatch "MSIE" isIE
BrowserMatch "Trident" isIE
Header set X-UA-Compatible "IE=edge" env=isIE

这需要您启用mod_headersmod_setenvif模块。
这个额外的HTTP头只会发送到IE浏览器,而其他浏览器则不会。

1

在JSF中我使用了:

<h:head>
    <f:facet name="first">
        <meta http-equiv="X-UA-Compatible" content="IE=EDGE" />
    </f:facet>

    <!-- ... other meta tags ... -->

</h:head>

0

在您的页面中添加标签不会控制Internet控制面板中的UI(当您选择工具->选项时出现的对话框)。如果您正在查看主页,可能是google.com、msn.com、about:blank或example.com,Internet控制面板无法知道您的页面内容可能是什么,并且不会在后台下载它。

请参阅MSDN上的此文档,其中讨论了兼容模式以及如何关闭您的站点的兼容模式。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接