IE8、IE9の互換表示モードをHTMLでそれぞれ無効にする裏技
2022-01-13 14:21:25
IE 8から、IEには互換モードが追加され、これをオンにすると、IEの下位バージョンでレンダリングされるようになりました。しかし、これによってページに不具合が生じることもあるので、通常は以下のコードをhtmlに追加して、IEに固定レンダリングモードを使用させるようにしています。
<meta http-equiv="X-UA-Compatible" content="IE=8"> <!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!?-- IE8 モードでのレンダリング -- >
<meta http-equiv="X-UA-Compatible" content="IE=7"> <!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!?-- IE7 モードでレンダリングされます -->
しかし、互換モードがないとIE8でしか正常に表示されないのに、IE8モードにするとIE9でCSS3に失敗してしまうという事態に遭遇しています。IE8とIE9で別々に互換性モードを無効にする必要があるようです。どうすればいいのでしょうか。バックグラウンドでブラウザのバージョンを判断して、IE8ならcontent="IE=8"、IE9ならcontent="IE=9"を出力すればいいんですけどね。しかし、このhtmlは不可能です。実は、以下のようなコードで簡単に実現できるのです。
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
コピーコード
コードは以下の通りです。
<meta http-equiv="X-UA-Compatible" content="IE=8"> <!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!?-- IE8 モードでのレンダリング -- >
<meta http-equiv="X-UA-Compatible" content="IE=7"> <!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!?-- IE7 モードでレンダリングされます -->
しかし、互換モードがないとIE8でしか正常に表示されないのに、IE8モードにするとIE9でCSS3に失敗してしまうという事態に遭遇しています。IE8とIE9で別々に互換性モードを無効にする必要があるようです。どうすればいいのでしょうか。バックグラウンドでブラウザのバージョンを判断して、IE8ならcontent="IE=8"、IE9ならcontent="IE=9"を出力すればいいんですけどね。しかし、このhtmlは不可能です。実は、以下のようなコードで簡単に実現できるのです。
コピーコード
コードは以下の通りです。
<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
関連
最新
-
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 実装 サイバーパンク風ボタン