ホームページ > 記事 > ウェブフロントエンド > IE5/IE5.5/IE6/FFの互換性問題の解決——CSS_Experience交換
blue ideal からの転載
著者の偏見
元のアドレス http://www.blueidea.com/tech/site/2006/3296.asp
ie の前にいくつかの異なるバージョンを見つけました独立して実行できるブラウザは、ページの互換性の問題をテストするのに最適です。試してみないとわかりません。ie6 や ff では問題なく動作していたページも、ie5 や ie5.5 ではめちゃくちゃになってしまいます。ie5 は web 標準の作成において「釘」であるとよく聞いていましたが、今ではそれを信じなければなりません。
問題があるので解決策を探しましょう。ネットで調べても関連記事はたくさんあります。一番直接的な方法は「ieの条件付きコメント」だと思います、とても便利です. ie のさまざまなバージョンのスタイルを作成できます。ただし、これにはバージョンごとにスタイルを記述する必要があり、ファイルの最適化には役立ちません。
関連する css hack をいくつか探したところ、ie5/ie5.5/ie6/ff の hack をまとめて記述できれば良いのではないかと思い、試した結果、良い方法を見つけました。実装方法を見てみましょう:
次の例のように、! important ステートメントを使用すると、指定したスタイル ルールの適用優先度を高めることができることは誰もが知っています:
----------- --- ----------------------------------
コードをコピー コードは次のとおりです。
e1{ background-color: red !important;/*提升优先权*/ background-color: blue; }
----------------------------------------------------- -------- ----
ただし、ie でこのように書くと問題が発生します。私の「css スタイルシートの優先順位について」と「css スタイルシートの優先順位について」を読んでください。補足」では、ie6 および ff で ! important 宣言を使用すると優先度を高めることができますが、ie6 の ! important 宣言は絶対的なものではなく、後続の同じ名前の属性定義によって置き換えられることがわかります。つまり、上記の例では、ie6 では最後の背景色の値「青」が適用されますが、ff では背景色の値は「赤」です。これに基づいて、ff と ie のスタイルを分離できます。
さて、ffとieの問題は解決したので、次はie自体の問題を解決しましょう。
dudu の「ie6 をバイパスして ie5 をサポートする別の方法 - ie も ">" をサポートする」を読んで、これにインスピレーションを受けました。">" を使用すると、本当に ie で認識できるのでしょうか?例を見てみましょう:
----------------------------------------------------- ----------
E1{ background-color: red; >background-color: blue;
}
------ ----------------------------------
ffで得られるものは、背景色は赤色、ff 時 ie で取得される背景色は青色です。スタイル再定義の規則に従って、ブラウザが ">" を認識できれば背景色は青色になるはずです。したがって、">" であることがわかります。 ie でのみ認識できます。これは非常に重要です。重要です。誰もが後から知ることになります。 (注: 「~」、「`」、「
など、他のいくつかの記号もテストしました------ -----------------------------
これで数バイト節約できるんじゃないでしょうか? ? それはそうですが、hack は標準ではありません。hack を乱用すると、標準からどんどん離れていくだけです。
上記は、ie5/ie5.5/ie6/ff の互換性問題を解決するための css_ experience 交換の内容です。その他の関連コンテンツについては、php 中国語 web サイト (www.php.cn) にご注意ください。