Exclusive css hack to distinguish IE8, IE9, IE10

If you want to achieve the same effect in IE8 and below browsers, and do not want to use methods such as css3pie or htc or conditional comments, you may need to use IE8 and IE9's exclusive css hack.

.test {                                                              /* 1. */ 
        color : #09F\0/ ; /* used to be IE8 only, now IE9/10 also supports it. If you want to exclude IE9, you need to use the following rule to reset the IE9 style */ 
} 
@media all and (min-width:0) {                     /* 2. */ 
    .test{color : red\9 ; } /* IE9 only, now IE10 also supports */
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { /* 3. */
   .test { color: green; } /* IE10+ */
}
:root .test { color : #963\9 ; } /* Before IE9 only, now 10 also supports it, the priority is higher than @media, the priority is too high, try to use it as little as possible */

 

Note: The previous IE8 only/IE9 only hack, IE10 was messed up when it appeared. To write a specific hack for ie8 or ie9, use a combination of 1/2/3. If possible, CSS conditional comments are more reliable.

 

Reprinted: https://blog.csdn.net/cuo9958/article/details/29822569