IE8のブートストラップスタイリングの仕方は？

Question

IE8でBootstrapを動作させたい場合は、Respond.jsを使用する必要があることが分かりました。一度組み込むと、1つのことを除いて、すべてがうまく見えます。それは私のローカルhtmlファイル内のIE5（エミュレーションとIE11）の開発ツールを使用してインラインコードで編集する場合でも、HTML5の要素のスタイルは調整されませんが、私はBootstrap exampleで同じことを行うと、動作するようです完全にうまくいく）。

からHTMLを変更する：（ブラウザ内で編集しているとき）の例ページ内

<footer>...</footer> 

<footer style="BACKGROUND-COLOR: tomato">...</footer> 

に努めていますが、私は私のローカルファイルを開いて行うときには動作しません。同じこと。

the exampleページ内のHTML5要素のフッターにスタイリングを追加することはできますが、ローカルファイルには追加できないのはなぜですか？ファイルが足りないか、何か別のことをする必要がありますか？ <footer>のスタイリングはどうすればできますか？

私がやることの1つの提案は、クラス.footerを持つ<div>要素ですが、これはブートストラップの例のようなものではありません。これが問題を解決する正しい方法であるかどうかわかりません経験している。

Answer 1

HTML5には、意味の意味をページに追加するための新しい要素がたくさんあります。たとえば、navは、ナビゲーションメニューを示します。

IE8はこれらについて何も知らないので、CSSを介してIE8に適用されたスタイルを認識しません。

<!--[if lt IE 9]> 
    <script> 
     document.createElement('header'); 
     document.createElement('nav'); 
     document.createElement('section'); 
     document.createElement('article'); 
     document.createElement('aside'); 
     document.createElement('footer'); 
    </script> 
<![endif]--> 

は明らかにあなたが現存するすべてのHTML5要素、あなたが実際に使用するものだけを定義する必要はありません。幸いなことに、単純にページのDOMに欠けている要素を追加することによってこの問題を解決する簡単な方法があります。ちなみに、このコードでは、Microsoftがブラウザのバージョンの違いをサポートするために導入した機能であるconditional commentを使用しています。

もう1つ重要なことは、HTML5要素はデフォルトでblockと表示されますが、IE8ではどちらもわかりません。特定の要素をスタイリングするときにどちらかdisplay: block;を指定することができ、この問題を軽減したり、CSSで卸それを行うには：あなたは（this oneのような）HTML5意識リセットスタイルシートを使用している場合、これはおそらく既に取られていることを

header, nav, section, article, aside, footer { 
    display:block; 
} 

注

あなたのためのケア。

---

回避策はhtml5shivとModernizrポリフィルスクリプトの形で存在するのjs liberaries

を使用するための他の方法。これらのライブラリのいずれかを使用して、古いIEバージョンにHTML5タグのサポートを追加します。