[解決済み】IE11用のCSSハックを書くには?[重複あり]
2022-04-05 15:01:59
質問
IE 11専用にハックしたり、CSSを書いたりするにはどうしたらいいですか?IE11で見栄えが悪いサイトがあります。あちこち検索してみましたが、まだ解決策が見つかりませんでした。
CSSセレクタはありますか?
どのように解決するのですか?
マイクロソフト独自のCSSルールを組み合わせて、IE11のフィルタリングを行う。
<!doctype html>
<html>
<head>
<title>IE10/11 Media Query Test</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style>
@media all and (-ms-high-contrast:none)
{
.foo { color: green } /* IE10 */
*::-ms-backdrop, .foo { color: red } /* IE11 */
}
</style>
</head>
<body>
<div class="foo">Hi There!!!</div>
</body>
</html>
このようなフィルタが機能するのは、次のような理由からです。
<ブロッククオートユーザーエージェントがセレクタを解析できない場合(つまり、有効な CSS 2.1 ではない場合)、セレクタとそれに続く宣言ブロック(ある場合)も無視しなければなりません。
<!doctype html>
<html>
<head>
<title>IE10/11 Media Query Test</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style>
@media all and (-ms-high-contrast:none)
{
.foo { color: green } /* IE10 */
*::-ms-backdrop, .foo { color: red } /* IE11 */
}
</style>
</head>
<body>
<div class="foo">Hi There!!!</div>
</body>
</html>
参考文献
関連
-
[解決済み] 位置固定が効かないのが絶対のように効いている【非公開
-
[解決済み] codepenでfont awesomeを使用する
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] セレクトボックスのプレースホルダーを作成するにはどうすればよいですか?
-
[解決済み] CSSのdisplayプロパティで遷移する
-
[解決済み] CSSでdivのアスペクト比を維持する
-
[解決済み] not:first-child セレクタ
-
[解決済み] 特定のクラスや属性を持たない要素を選択するCSSセレクタは書けますか?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】@font-faceが機能しない。
-
[解決済み] ユーザーエージェントのスタイルシートが私のCSSを上書きしないようにする方法
-
[解決済み] <label for=""> CSSを非表示にする方法
-
[解決済み] divを親の中で自動的に縦に重ねるにはどうしたらいいですか?
-
[解決済み] DIVを重ねる?
-
[解決済み] 幅・高さをピクセル単位からパーセント単位で設定する。
-
[解決済み] 四角いボタンの作り方
-
[解決済み] 入力・テキストフィールドの背景色
-
[解決済み】JavaScriptでIEのバージョン(v9以前)を検出する。
-
[解決済み] Internet Explorer 固有の CSS や Internet Explorer 固有の JavaScript コードなど、特定の状況下で Internet Explorer 10 のみをターゲットにするにはどうすればよいですか?