如何為IE10專門添加CSS Hack？

Question

我想為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>

它不起作用。 請幫助。

Answer 1

您可以使用輕松跟蹤IE的最新版本（主要是IE 10和IE 11）

1. CSS媒體查詢hack：

/* 
    #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 */  
}

讀這個

工作實例

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被認為是不好的做法。

條件評論（即10條條款評論）：

如果要為IE加載外部css文件，可以使用條件注釋 。 但正如你提到的那樣，你想要IE 10和ie10刪除條件評論。

微軟在ie10中刪除條件評論 。

Answer 2

這是我在項目中使用的另一個技巧，你可以用你的類或自己的CSS替換h1

僅限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; }

單擊此處查看IE的所有早期版本