HTML中的条件注释

Question

could you please tell me where is the mistake. 你能告诉我哪里错了吗？ I cant see any text in conditional comments in any browser. 我无法在任何浏览器中的条件注释中看到任何文本。

web.html
<!DOCTYPE html>
<html lang="en-US>
<head>
    <meta charset="utf-8" />
    <link href="style.css" type="text/css" rel="stylesheet" />
<head/>
<body>
    <!--[if !IE]>
        <p><span class="p-style">XXXXXXXXXXXX</span></p>
    <![endif]-->

    <!--[if IE]>
        <p><span class="p-style-IE">YYYYYYYYYYYYY</span></p>
    <![endif]-->
</body>
</html>

style.css
.p-style {
    color:red;
}

.p-style-IE {
    color:green;
}

Thank you. 谢谢。

Answer 1

Browsers other than IE treat the conditional statements as comments because they're enclosed inside comment tags. IE以外的浏览器将条件语句视为注释，因为它们被包含在注释标记内。

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

However, when you're targeting a browser that is NOT IE you have to use 2 comments, one before and one after the code. 但是，当您定位的浏览器不是IE时，则必须使用2条注释，一条在代码之前，一条在代码之后。 IE will ignore the code between them, whereas other browsers will treat it as normal code. IE将忽略它们之间的代码，而其他浏览器会将其视为普通代码。 The syntax for targeting non-IE browsers is therefore: 因此，针对非IE浏览器的语法为：

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

Your code has some problems and I corrected them. 您的代码有一些问题，我已予以纠正。 Check with IE9 and other browsers. 使用IE9和其他浏览器进行检查。 Now its working fine except in IE10 and higher (cuz IE10 and above no longer support conditional tags) 现在，它的工作正常，但在IE10及更高版本中除外（因为IE10及更高版本不再支持条件标记）

 <!DOCTYPE html> <html lang="en-US"> <head> <meta charset="utf-8" /> <link href="style.css" type="text/css" rel="stylesheet" /> <head/> <body> <p><span class="p-style">XXXXXXXXXXXX</span></p> <p><span class="p-style-IE">YYYYYYYYYYYYY</span></p> <!--[if IE]> <style> .p-style {color:red;} .p-style-IE {display: none;} </style> <![endif]--> <!--[if !IE]><!--> <style> .p-style {display: none;} .p-style-IE{color:green;} </style> <!--<![endif]--> </body> </html>

Update : For IE10 and IE11, 更新：对于IE10和IE11，

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  
   /* IE10+ specific styles go here */  
}

we create a media query using -ms-high-contrast, in which you place your IE10+ specific CSS styles. 我们使用-ms-high-contrast创建一个媒体查询，您可以在其中放置IE10 +特定的CSS样式。 Because -ms-high-contrast is Microsoft-specific (and only available in IE10+), it will only be parsed in Internet Explorer 10 and greater. 因为-ms-high-contrast是特定于Microsoft的（并且仅在IE10 +中可用），所以只能在Internet Explorer 10及更高版本中对其进行解析。

HTML中的条件注释

问题描述

1 个解决方案

解决方案1
4 已采纳 2015-11-14 10:35:08

HTML中的条件注释

问题描述

1 个解决方案

解决方案1 4 已采纳 2015-11-14 10:35:08

解决方案1
4 已采纳 2015-11-14 10:35:08