【问题标题】：How to add CSS Hack specifically for IE10?如何专门为 IE10 添加 CSS Hack？
【发布时间】：2014-08-10 20:08:54
【问题描述】：

我正在尝试仅为 iE 10 添加 css。

实际上，我的 css 在 chrome 和 firefox 中运行良好。但是在 IE 10 中造成了一些问题。

我尝试了这段代码并制作了 ie10.css，但它不起作用。

<script> 
if (/*@cc_on!@*/false) { 

    var headHTML = document.getElementsByTagName('head')[0].innerHTML; 

headHTML    += '<link type="text/css" rel="stylesheet" href="css/ie10.css">'; 
document.getElementsByTagName('head')[0].innerHTML = headHTML; 
} 
</script>

它不工作。请帮忙。

【问题讨论】：

stackoverflow.com/questions/9900311/…?请参阅第二个答案。
我认为更好的问题是：为什么您的样式在 IE10 中不起作用。最好尝试修复这个问题，而不是引入一个 hack，它可能会在 IE11 和未来版本中失败。

标签： javascript jquery css internet-explorer-10

【解决方案1】：

您可以使用

轻松跟踪最新版本的 IE（主要是 IE 10 和 IE 11）

1. CSS 媒体查询技巧：

/* 
    #ie10,11 will only be red in MSIE 10, 
    both in high contrast (display setting) and default mode 
*/

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 
   //-- Put your IE specific css class here 
}

或

@media screen and (min-width:0\0) {  
    /* IE9 and IE10 rule sets go here */  
}

Read this

Working Example

2。浏览器检测：

if ($.browser.msie && $.browser.version == 10) {
  $("html").addClass("ie10");
}

3.使用脚本（未测试）：

<script>
    /*@cc_on
      @if (@_jscript_version == 10)
          document.write('<link type= "text/css" rel="stylesheet" href="your-ie10-styles.css" />');
      @end
    @*/
</script >

注意：我知道document.write 被认为是不好的做法。

条件 cmets（即 10 个丢弃的条件 cmets）：

如果你想为IE加载外部css文件，你可以使用conditional cmets。但正如您在问题中提到的，您希望 IE 10 和 ie10 删除条件 cmets。

microsoft drop conditional comments in ie10.

【讨论】：

@kirantiwary：欢迎您 :)
@IshanJain 我不是反对者，但我认为反对者是为了实践。如果这是一个 CSS 问题，也许应该重新考虑使用的方法。一旦你这样做，你最终会像过去一样为每个浏览器构建一个 CSS 文件。此外，CC 意味着过滤 Ie 版本，这里没有那种目的:)。问候
@Joe：是的，你是对的。它适用于所有最新版本的 IE（IE 10+）。我已经在回答中提到了它。反正没问题。很高兴帮助:)
@IshanJain：为了防止更多的反对票，您应该声明只有在其他任何事情失败时才应该使用它（正如 Gcyrillus 所评论的那样）。我们不希望人们认为这是修复 IE10 问题时的唯一方法。我赞成您的回答，因为我认为它具有足够的教育意义，但我同意应该避免这种情况。顺便说一句，$.browser 已被弃用。

【解决方案2】：

这是我在项目中使用的另一个技巧，您可以将 h1 替换为您的类或自己的 CSS

仅限 IE10

http://css-tricks.com/ie-10-specific-styles/

使用这个 JavaScript：

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

然后使用这个 CSS：

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

Click here for all earlier version for IE

【讨论】：