Internet Explorer専用CSS

ホームページを制作していると、ブラウザごとに異なって見える場合がたまにあります。 特にInternet Explorer 8やInterneter Explorer 9で期待どおりに動作していない 互換性の問題が発生する場合が頻繁です。 この場合は、次のようにインターネットエクスプローラ専用のCSSを使用して問題を解決しようと試みることができます。

/* IE8은 \0을 사용합니다.  */
@media all\0 {
.dude { color: brown; }
.gal { color: orange; }
}

/* IE9는 \9를 사용합니다.  */
@media all and (monochrome:0) {
.dude { color: yellow\9; }
.gal { color: blue\9; }
}

/* IE10과 IE11은 -ms-high-contrast */
@media all and (-ms-high-contrast:none)
{
.foo { color: green } /* IE10 */
*::-ms-backdrop, .foo { color: red } /* IE11 */
}

ちなみに-ms-high-contrastは二つの値（none、active）をサポートします。

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