如何在CSS中检测IE和Edge浏览器？

Question

有没有一种标准方法可以在css中检测IE和Edge浏览器？我在javascript文件中看到了检测的响应，但我在css中寻找一个

Answer 1

对于IE 9及更低版本，加载条件样式表：

n*(n+1)//2

IE 10及更高版本不支持此功能，因此您必须使用媒体查询：

start = 3
end = 9 # inclusive
result = ((end*(end+1))//2 - ((start-1)*(start))//2)*5 + (end-start+1)*17

For Edge 12-15：

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

修改

For Edge 16 +

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
   /* IE10+ CSS */
}

Answer 2

不确定边缘，但是目标即10/11你可以使用：

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { //styles }

Answer 3

Edge的接受答案在Edge 16中无效。

此替代方案有效：

@supports (-ms-ime-align:auto) {
    /* IE Edge 16+ CSS */ 
}

通过https://stackoverflow.com/a/32202953

（添加新答案，因为我没有评论权限。）

Answer 4

所有合一：

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active),
@supports (-ms-accelerator:true) or (-ms-ime-align:auto) {
    /* All CSS is here */
    .example {
        /* ... */
    }
}

Answer 5

用于支撑12+和16+边缘作为一个衬里

@supports (-ms-accelerator:true) or (-ms-ime-align:auto) {
     // your css here
}