ホームページ  >  記事  >  ウェブフロントエンド  >  IE7_Experience Exchange の CSS ハック

IE7_Experience Exchange の CSS ハック

WBOY
WBOYオリジナル
2016-05-16 12:09:261142ブラウズ

IE7 では多くのバグが修正され、一部のセレクターのサポートが追加されたため、*html {} や html>body {} などの IE を非表示または表示するためのハックは IE7 では機能しなくなります。 CSS Hack は推奨されておらず、条件付きコメントは確実なフィルターですが、条件付きコメントは HTML 内でのみ表示できるため、CSS Hack は依然としてその役割を果たしています。 Nanobot は、IE7 向けのいくつかの CSS ハック、具体的には以下を発見しました:

>本文
html*
*+html

これら 3 つの記述方法のうち、最初の 2 つは不正な CSS 記述方法であり、標準準拠のブラウザでは無視されますが、IE7 ではそうは考えられません。 >bodyの場合は欠落しているセレクタをグローバルセレクタ*に置き換える、つまり*>bodyに処理することになりますが、この現象は>セレクタだけでなく+セレクタや~セレクタにも存在します。 html* の場合、html と * の間にスペースがないため、これも CSS 構文エラーですが、IE7 はこれを無視せず、ここにスペースがあると誤って認識します。 3 番目の *+html の場合、IE7 は html の前の DTD 宣言も要素であると認識するため、これら 3 つのメソッドのうち、このメソッドだけが正当な CSS 記述であり、バリデーターを通過できることを意味します。したがって、検証は著者が推奨するハックの使用法でもあります。

最後に、著者は最良の方法を提示しました:

IE 6 以前
html 要素を選択するには * html {} を使用します。
IE 7 以前
HTML 要素を選択するには *+html、* html {} を使用します。 7 のみ
**+html {} を使用して html 要素を選択します。
IE 7 および最新のブラウザのみ
html>body {} を使用して body 要素を選択します。
最新のブラウザでは使用できません。 IE 7)
html>/**/body {} を使用して
の body 要素を選択します。

具体的な情報については、原文を参照してください:

IE7 のための簡単な CSS ハック

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