<!--[if !IE]>在这种情况下没有按预期工作

Question

<!--[if !IE]>在这种情况下没有按预期工作

htmlinternet-explorerconditional-comments

146

我在获取信息方面遇到了麻烦

<!--[if !IE]>

我在工作时遇到问题，想知道是否因为我的文档里有这个东西

<!doctype html>
<!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
<!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
<!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="">
<!--<![endif]-->

当我添加

<!--[if !IE]><!-->
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css" />
<!--<![endif]-->

由于某些原因，当我将以下内容添加到我的标题时，它不起作用。但是，如果我添加以下内容：

<!--[if !IE]><!-->
    <style>
        All my CSS content in here
    </style>
    <!--<![endif]-->

如何解决这个问题？

当我移除了，并删除了 /（并将其添加到主模板中，以防止CMS将其重新添加），所有内容都在 Firefox 中恢复正常了，但现在样式表也被应用于 IE！

所以我尝试了：

将实际的 HTML 页面路径（在头部）与样式表文件分开，然后使用条件注释来链接不同的样式表。

<!--[if IE]>
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css">
<![endif]-->

并且

<!--[if !IE]> -->
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css">
<!-- <![endif]-->

但那没有起作用。

基本上，我正在尝试让这个页面工作: http://css-tricks.com/examples/ResponsiveTables/responsive.php。但是将CSS内容移入样式表中。肯定很简单。我错过了什么吗？如果不必使用jQuery，我宁愿不用。

- user1516788

1

在 。 - techfoobar

32

注意：如果使用IE浏览器，只有IE9及以下版本可用。 - cameronjonesweb

有些人在某些页面上留下了有趣的 IF IE 信息。 - neverMind9

@cameronjonesweb，你能提供一个参考链接吗？否则这样的陈述就不是很有用了。 - trainoasis

1

@trainoasis，我本来可以的，只是我的评论已经_5年了_。 - cameronjonesweb

15个回答

71

除了Internet Explorer浏览器，其他浏览器都将条件语句视为注释，因为它们被包含在注释标签中。

<!--[if IE]>
Non-Internet Explorer browsers ignore this
<![endif]-->

然而，当你的目标浏览器不是Internet Explorer而是其他浏览器时，你需要使用两个注释，一个在代码前面，一个在代码后面。Internet Explorer将忽略它们之间的代码，而其他浏览器将把它看作普通的代码。因此，针对非Internet Explorer浏览器的语法如下：

<!--[if !IE]-->
Internet Explorer ignores this
<!--[endif]-->

注意：自Internet Explorer 10起，这些条件注释不再受支持。

- user1324409

1

太好了。谢谢你。样式表起作用了，但我现在遇到的问题是，在页面顶部的标题上方，在IE中会出现（标签放在标题区域而不是正文）。 - user1516788

22

这个答案是不正确的，因为IE ignores this在IE（7、8或9）中并不会被隐藏！ - JohnB

3

所有答案对我都没用，可能是最近IE10的更新引起了一些变化（在IE9模式下也尝试过）。最终所有的尝试都导致在所有浏览器（包括IE和非IE）中都进入了“!IE”部分。 - Danny Varod

2

IE10不支持条件语句。 - Scorpius

1

请注意  中的空格 - 不应该有任何空格（例如在!--和[之间）。它不适用于带有空格的情况。 - Robert Skarżycki

显示剩余3条评论

40

Internet Explorer无法被定位的原因是：从Internet Explorer 10开始，不再支持条件注释。来自Microsoft官网的消息如下：

为了提高互操作性和符合HTML5标准，Internet Explorer 10标准模式和怪异模式已经取消了对条件注释的支持。

请参阅此处以获取更多详细信息：不再支持条件注释。

如果您迫切需要定位Internet Explorer，则可以使用此jQuery代码将ie类添加到<html>，然后在CSS中使用.ie类来定位Internet Explorer浏览器。

if ($.browser.msie) {
    $("html").addClass("ie");
}

$.browser在jQuery 1.9之后不再可用。如果您升级到1.9以上的jQuery或者已经使用它，您可以在jQuery之后包含jQuery迁移脚本，以添加缺失的部分：jQuery Migrate Plugin

或者，您可以查看这个问题，了解可能的解决方法：browser.msie error after update to jQuery 1.9.1

- Selay

这是一个非常好的解决方案！我甚至不需要在DOM树上使用它来应用某些类。 - mjs

3

请注意，自 jQuery 1.3 版本以来，此方法已被弃用，并在1.9版本中被移除。 - Jøran

13

Microsoft推荐的下级显示条件“注释”的语法是这样的：

<![if !IE]>
<link type="text/css" rel="stylesheet" href="/stylesheets/no-ie.css" />
<![endif]>

这不是注释，但它们可以正常工作。

- user1479055

1

找到了这个链接，支持这个答案，还有很多其他信息可以帮助这个线程，我认为这是一个重要的主题...唯一的区别是使用隐藏或显示的语法，我不确定这将如何影响其他浏览器...http://msdn.microsoft.com/en-us/library/ms537512.ASPX - user1360809

3

注意：这些条件注释在IE 10及以上版本中已不再受支持。 - Flimm

11

我使用这个并且它有效：

<!--[if !IE]><!--> if it is not IE <!--<![endif]-->

- Francis

这导致Firefox将整个内容都视为注释。@Charmander的解决方案在IE和Firefox上都有效 - <![if !IE]><![endif]> - Tom Chamberlain

4

注意：自IE 10起，这些条件注释将不再受支持。 - Flimm

8

这是针对直到Internet Explorer 9的：

<!--[if IE ]>
    <style>
        .someclass{
            text-align: center;
            background: #00ADEF;
            color: #FFF;
            visibility: hidden;  // In case of hiding
        }
        #someotherclass{
            display: block !important;
            visibility: visible; // In case of visible
        }
    </style>
<![endif]-->

这是针对Internet Explorer 9之后的版本

  @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {Enter your CSS here}

- Chintu the cool kid

8

首先，正确的语法是：

<!--[if IE 6]>
<link type="text/css" rel="stylesheet" href="/stylesheets/ie6.css" />
<![endif]-->

请试试以下文章：

另外还有一个方法：

使用jQuery检查浏览器：

if($.browser.msie) { // Do something... }

在这种情况下，您可以更改一些元素的CSS规则或添加新的CSS链接引用：

阅读此内容：使用jQuery动态应用样式表

- BorisD

请参考用户1324409上面的答案，那个更准确。 - Chris Peters

2

由于jQuery的更新，任何使用$.browser.msie的人都必须包含jquery-migrate.js，然后才能正常工作。 - AspiringCanadian

1

注意：这些条件注释在IE 10及以上版本中不再受支持。 - Flimm

答案中提供的链接已失效。 - Pankaj

8

你需要在  中添加一个空格。我的完整CSS代码块如下，因为IE8无法很好的支持媒体查询。

<!-- IE 8 or below -->
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css"  href="/Resources/css/master1300.css" />
<![endif]-->
<!-- IE 9 or above -->
<!--[if gte IE 9]>
<link rel="stylesheet" type="text/css" media="(max-width: 100000px) and (min-width:481px)"
    href="/Resources/css/master1300.css" />
<link rel="stylesheet" type="text/css" media="(max-width: 480px)"
    href="/Resources/css/master480.css" />
<![endif]-->
<!-- Not IE -->
<!-- [if !IE] -->
<link rel="stylesheet" type="text/css" media="(max-width: 100000px) and (min-width:481px)"
    href="/Resources/css/master1300.css" />
<link rel="stylesheet" type="text/css" media="(max-width: 480px)"
    href="/Resources/css/master480.css" />
<!-- [endif] -->

- John Hayford

感谢您的评论，但如果我使用  <link rel="stylesheet" type="text/css" href="/stylesheets/no-ie.csss" />  那么其他浏览器也会应用这个样式。 - user1516788

3

这不就是重点吗，让其他浏览器应用那个部分？ - John Hayford

2

这里提到的!IE技术实际上会在IE 7到10中执行被注释的代码块。 - Ian Campbell

1

注意：这些条件注释在IE 10及以上版本中不再受支持。 - Flimm

8

针对Internet Explorer用户：

<!--[if IE]>
Place content here for users of Internet Explorer.
<![endif]-->

对于所有其他目标：

<![if !IE]>
Place content here for Users of all other browsers.
<![endif]>

条件注释只能被Internet Explorer检测到。其他所有浏览器都将其视为普通注释。

要针对Internet Explorer 6, Internet Explorer 7等进行定位，必须在if语句中使用“大于等于”或“小于（等于）”符号。像这样：

大于或等于：

<!--[if gte IE 7]>
Place content here for users of Internet Explorer 7 or above.
<![endif]-->

小于：

<!--[if lt IE 6]>
Place content here for users of Internet Explorer 5 or lower.
<![endif]-->

来源：mediacollege.com

- Munchies

2

注意：这些条件注释在IE 10及以上版本中不再受支持。 - Flimm

5

对于 Internet Explorer 浏览器：

<!--[if IE]>
<meta http-equiv="Content-Type" content="text/html; charset=Unicode">
<![endif]-->

对于所有非Internet Explorer浏览器：

<![if !IE]>
<meta http-equiv="Content-Type" content="text/html; charset=utf8">
<![endif]>

对于所有版本高于Internet Explorer 8的Internet Explorer浏览器或所有非Internet Explorer浏览器：

<!--[if (gt IE 8)|!(IE)]><!--><script src="/_JS/library/jquery-2.1.1.min.js"></script><!--<![endif]-->

- Kapil

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Thinking80s · Accepted Answer

249

<!--[if !IE]><!--><script src="zepto.min.js"></script><!--<![endif]-->
<!--[if IE]><script src="jquery-1.7.2.min.js"></script><![endif]-->

注意：这些条件注释从IE 10开始不再受支持。

- Thinking80s

42

截至2013年6月，这是本页面上唯一正确的答案。 - JohnB

2

这一行缺少闭合的尖括号吗？它不应该是：<script src="zepto.min.js"></script> - n00shie

1

这个解决方案以及其他所有条件注释的解决方案都无法检测IE 10 / IE 11。 - Lloyd Banks

9

不适用于IE 11，即使条件为!IE，它仍会加载脚本。 - Giedrius

50

从IE10开始，不再支持条件注释：http://msdn.microsoft.com/zh-cn/library/ie/hh801214(v=vs.85).aspx - acdcjunior

显示剩余10条评论