業務でIE8には対応していた画面をIE11にも対応させる必要が出てきたのでIE11にのみスタイルシートを適用させる方法をご紹介します。
IE11にのみCSSを適用させたい場合はCSSハックという手法を用いると便利です。
IE11にのみ適用させるCSSハックの記述方法
|
1 2 3 4 5 6 |
@media all and (-ms-high-contrast:none){ *::-ms-backdrop, #ie11CssHackSample { color: red; font-size: 36px; } } |
IE10以下に適用させるCSSハックの記述方法
-
IE10以下に適用させたい場合は「*::-ms-backdrop,」の指定を外します。
|
1 2 3 4 5 6 |
@media all and (-ms-high-contrast:none){ #ie11CssHackSample { color: red; font-size: 36px; } } |
実行サンプル
ie11でこのページを表示した場合のみ、この文章がフォントサイズが24pxで赤字で表示されます
