ホームページ  >  記事  >  ウェブフロントエンド  >  IEをHTML5に対応させる方法

IEをHTML5に対応させる方法

不言
不言オリジナル
2018-05-07 15:38:162179ブラウズ

この記事では、IE を HTML5 に対応させる方法を主に紹介します。必要な友達に参考にしてもらいたいと思います。HTML5 タグを使用するサイトが増えています。はい、IE6、IE7、IE8 を使用している人はまだたくさんいます。すべてのブラウザに通常のアクセスを許可するには、次の 2 つの解決策があります。 HTML5タグを使い始めているサイトが増えてきていますが、まだIE6、IE7、IE8を使っている人が多いのが現状です。すべてのブラウザに通常のアクセスを許可するには、2 つの解決策があります:

1. Web サイト用に複数のテンプレート セットを作成し、プログラムを使用してユーザー エージェントを判断し、たとえば、ブラウザ ユーザーごとに異なるページを表示します。 : ようく。

2. JavaScript を使用して、HTML5 をサポートしていないブラウザが HTML タグをサポートできるようにします。

IE のより良いソリューションは html5shiv です。 htnl5shiv は主に、HTML5 で提案された新しい要素が IE6-8 で認識されず、子要素をラップする親ノードとして使用できず、CSS スタイルを適用できないという問題を解決します。 CSS スタイルを不明な要素に適用するには、document.createElement(elementName) を実行するだけです。 html5shiv はこの原則に基づいて作成されました。

html5shiv の使い方は非常に簡単です。IE9 が html5 をサポートしていることを考慮すると、次のコードをページの先頭に追加するだけです:


コードをコピーします コードは次のとおりです:

<!-–[if lt IE 9]--><script src=" http://html5shiv.googlecode.com/svn/trunk/html5.js "></script ><!--[endif]–- >

以下はいくつかの追加です:


もちろん私のブログも含みます。 HTML5 に関しては、IE について触れなければなりません。Apple、Google、Opera、Mozilla などの主流のブラウザ メーカーは、HTML 標準の新しいバージョンの策定と推進に積極的に参加していますが、Microsoft は HTML 5 仕様を否定しています。ただし、Microsoft はつい最近、IE で HTML 5 をサポートすると発表しました。現時点では、IE8 以前は HTML5 タグをサポートできません。しかし、サイトポイントでIEにHTML5をサポートさせる方法を見つけました。

以下は、処理前の IE 8 で表示される例です:


IE (IE6 を含む) で HTML5 要素をサポートするには、次の JavaScript を HTML ヘッダーに追加する必要があります。これは単純な document.createElement ステートメントです。条件付きアノテーションを使用して、IE のオブジェクト内に対応するノードを作成します。 在IE 8显示的例子,未作处理前

コードをコピーしますコードは次のとおりです:

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

上記のコードを追加した後、IE8に表示される効果は次のとおりです:


サイトポイントの例でノードを作成するためのJavaScriptコードは次のようになります。あまりにも大げさになるので、smashingmagazine が提供するコードのほうが簡潔だと思われます。 在IE 8显示的例子,处理后デモは次のとおりです


ヒント: 実行する前にコードの一部を変更できます

コードをコピーしますコードは次のとおりです:

<!--[if IE]> 
<script> 
(function(){if(!/*@cc_on!@*/0)return;var e = "header,footer,nav,article,section".split(&#39;,&#39;),i=e.length;while(i--){document.createElement(e[i])}})() 
</script> 
<![endif]-->

HTML5はデフォルトでインライン要素として動作します。これらの要素をレイアウトするには、次の例のように CSS を使用してブロック要素に手動で変換します。


コードをコピーします コードは次のとおりです:

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

以上がIEをHTML5に対応させる方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。