CssでIEおよびEdgeブラウザを検出する標準的な方法はありますか?javascriptファイルで検出に対する応答を見ましたが、cssで1つを探しています
IE 9以下の場合、条件付きスタイルシートをロードします。
<!--[if IE]>
<link rel="stylesheet" type="text/css" href="ie.css" />
<![endif]-->
IE 10以降はこれをサポートしていないため、メディアクエリを使用する必要があります。
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS */
}
エッジ12-15の場合:
@supports (-ms-accelerator:true) {
/* Edge 12+ CSS */
}
[〜#〜] edit [〜#〜]
Edge 16+の場合
@supports (-ms-ime-align:auto) {
/* Edge 16+ CSS */
}
Edgeの受け入れられた回答は、Edge 16では機能しません。
この代替案は機能します:
@supports (-ms-ime-align:auto) {
/* IE Edge 16+ CSS */
}
https://stackoverflow.com/a/3220295 経由
(コメント権限がないため、新しい回答を追加します。)
Edgeについてはわかりませんが、10/11をターゲットにするには次を使用できます。
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
//styles
}
Edge 12+および16+を1つのライナーとしてサポートするため
@supports (-ms-accelerator:true) or (-ms-ime-align:auto) {
// your css here
}