JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

Internet Explorerで```html
要素の背景色が正しく表示されない原因と解決方法

Internet Explorer 11（IE11）は、HTML5で新たに追加された <main> 要素に対応していません。そのため、<main> 要素を使ってもIE11では正しく認識されず、背景色やスタイルが適用されないという問題が発生します。

解決策1：JavaScriptで要素を認識させる

Modernizrなどのライブラリを利用するか、次の一行のJavaScriptを追加することで、IE11に <main> 要素を認識させることができます。

document.createElement('main');

解決策2：CSSでdisplayを明示的に指定する

ただし、上記のJavaScriptを追加しただけでは不十分です。IE11は <main> 要素を未知の要素として扱うため、デフォルトではブロックレベル要素として振る舞いません。その結果、背景色やレイアウトが意図した通りに表示されない場合があります。最後に、以下のCSSを必ず追加してください。

main {
    display: block;
}

まとめ

document.createElement('main') で要素を認識させ、CSSの display: block; で表示形式を明示する——この2つの対策を組み合わせることで、IE11環境でも <main> 要素を含むページを正しく表示できるようになります。

  1. Windows 7でInternet Explorer 9を入手する3つの方法【ダウンロード・ダウングレード・IE Tab】

    Windowsユーザーが日常的にInternet Explorer(IE)を使うことは少なくなりましたが、特定のバージョンのIEが必要になる場面は今でも存在します。最も多いのがWebサイトの表示確認やテストですが、それ以外の理由で必要になることもあります。この記事では、Windows 7にInternet Explorer 9を導入する方法を紹介します。一部の方法はIE9以外のバージョンを入手する際にも役立つため、IE9以外をお探しの場合にもぜひ参考にしてください。 IE9の入手が難しい最大の理由は、インターネット上にインストーラーへの有効なリンクがほとんど残っていない点にあります。実際にはリ

  2. Internet Explorer 9 徹底レビュー ― 遂に本気を見せたMicrosoftの新ブラウザ

    ご存じの方も多いかと思いますが、Internet Explorer 9(IE9)が正式リリースされました。Microsoftの最新製品であり、同社の製品としては珍しく、実際にかなり出来栄えの良い仕上がりです。Microsoftから生まれた初めての「まともな」ブラウザと言えるでしょう。FirefoxやChromeといったライバルに対して真剣な脅威となるのかどうかは、白熱した、そしておそらく永遠に決着しない議論のテーマとなっています。ここでは予言めいた決着をつけるのではなく、以前のベータ版テストを補完する形で、改めてこのブラウザをレビューしたいと思います。IE9ベータ版はなかなか素晴らしい出来でし