ホームページ  >  記事  >  ウェブフロントエンド  >  CSS における ! important の重要性の詳細な紹介

CSS における ! important の重要性の詳細な紹介

黄舟
黄舟オリジナル
2017-07-27 13:10:522045ブラウズ

CSS の ! important は非常に重要な属性ですが、52CSS.com にはこの分野に関する知識があまりありません。それを比較理解するために次の記事を読んでください。
数日前に CSS コードを書いていたとき、またしても大変でした。なぜなら、IE6 の CSS サポートが非常に貧弱だからです。なぜなら、私が作ったものは基本的に IE に基づいていたからです。しかし、私がこのブログ用に書いた CSS は複数のブラウザ (IE) をサポートする必要があります。問題なのは、IE8 ブラウザに付属している Windows 7 をインストールしたことです。しかし、IE6 を開いたときは問題ありませんでした。 , それでもずれが発生したため、IE6 ではどうなっているのか見てみることにしました。
すべての CSS ブロックをボーダーで囲んでみたところ、IE では 2 つの p の間の距離が他のブラウザに比べて明らかに広いことがわかりました。たとえば、margin 属性が 20px の p を記述すると、IE では 40px のような感じになります。元の精度の計算は正しく行われているのに、IE ではずれているのはなぜでしょうか。
この属性は実際には CSS 仕様に含まれていることに気づきましたが、多くの CSSer が解決策を見つけたのは、IE6 がサポートしていなかったためです。一般的に CSS では、同じ CSS ブロック内に同じ属性を 2 つ記述すると、実際には下の属性が実行されます。例:

   1: home{
   2:    margin-left:20px;
   3:    margin-left:40px;
   4: }
   5:

その後、実行は実際には 40px に基づいて実行されます。実行されるステートメントの優先順位を設定します。上記のステートメントを

 1: home{
   2:    margin-left:20px!important;
   3:    margin-left:40px;
   4: }
   5:

に変更すると、Firefox、Google Chrome、IE7 以降では 20px として実行されますが、IE6 は ! important 仕様をサポートしていないため、IE6 では引き続き 40px として実行されます。 IE6 の表示効果が他のブラウザと異なることがわかった場合は、このルールに従って、2 つ設定し、上の 1 つに ! important タグを追加します。次の文は必要ありません。このようにするとIE6は以下のように実行されます。上級 CSSer は次のように述べています。「今日の CSS はどこにでもあります。重要です。」これはすべて IE6 のせいです。IE6 は単なる代謝物の塊であると言っても過言ではありません。

以上がCSS における ! important の重要性の詳細な紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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