CSS |仅将样式应用于 Internet Explorer答案

【问题标题】：CSS | Only apply styling to Internet ExplorerCSS |仅将样式应用于 Internet Explorer
【发布时间】：2015-04-29 18:27:37
【问题描述】：

目前我正在 Internet Explorer 10 和 11 上测试该网站。

目前我有一个样式表，其中包含一些样式，仅适用于访问者使用 Internet Explorer 浏览网站时。我尝试使用条件 cmets，但 Internet Explorer 10 和 11 不支持它们。

我想知道是否有人以前处理过这个问题并且可以将我推向正确的方向。非常感谢所有帮助。

【问题讨论】：

标签： css internet-explorer

【解决方案1】：

这是 IE10 和 IE11 的代码。它将类添加到 html 标签。

<!--[if !IE]><!-->
<script>
if (/*@cc_on!@*/false) {  
    document.documentElement.className+=' ie10';  
}  
</script>
<!--<![endif]--> 

<script>
var ua = navigator.userAgent,
      doc = document.documentElement;
if((ua.match(/rv:11.0/i))){
    doc.className = doc.className + " ie11";
  }
</script>

【讨论】：

【解决方案2】：

不再支持条件 cmets

已在 Internet Explorer 10 标准和怪癖模式中删除了对条件 cmets 的支持，以提高互操作性和与 HTML5 的合规性。

This Applies to Internet Explorer 10 and later.

更多信息Read here

【讨论】：

【解决方案3】：

你可以在head中添加这个标签

<!--[if IE 7]>
<html class="ie ie7">
<![endif]-->
<!--[if IE 8]>
<html class="ie ie8">
<![endif]-->
<!--[if !(IE 7) & !(IE 8)]><!-->
<html>
<!--<![endif]-->

通过继承类你可以改变它的设计就像

.ie7 body{background: transparent}

【讨论】：

正如我在 OP 中所述，Internet Explorer 10 和 11 不支持条件 cmets。
你甚至可以使用类似 jquery 的函数 if ($.browser.msie && $.browser.version == 10) { $("html").addClass("ie10"); }

【解决方案4】：

像这样将用户代理添加到 html 中：

var doc = document.documentElement;
doc.setAttribute('data-useragent', navigator.userAgent);

IE10 的用户代理是：

Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)

这将导致：

<html data-useragent="Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)">

然后你可以设置样式：

html[data-useragent*='MSIE 10.0'] h1 {
 color: blue;
}

所以标题在 IE10 中只会是蓝色的。

【讨论】：

【解决方案5】：

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  #myClass { color: red; }
}

查看 CSS hacks http://www.paulirish.com/2009/browser-specific-css-hacks/

【讨论】：