1. ホーム
  2. html

[解決済み] CSSで!importantプロパティを使用するタイミング [重複]...

2023-03-04 20:30:02

質問

を考えてみましょう。

#div p {
    color: red !important;
}
...
#div p {
    color: blue;
}

私は、どのように !important がどのように機能するかは理解しています。この場合、div が赤くレンダリングされるのは、div が優先されるからです ( !important ). しかし、私はまだこれを使用する適切な状況を把握することができません。以下のような例はありますか? !important がその日を救うような例はありますか?

どのように解決するのですか?

これは実際のシナリオです。

このシナリオを想像してください

  1. サイトの視覚的な側面をグローバルに設定するグローバル CSS ファイルがあるとします。
  2. あなた (または他の人) は、要素自体にインラインスタイルを使用しています。 <ストライク 通常 であり、非常に悪い習慣です。

この場合、グローバル CSS ファイルで特定のスタイルを重要なものとして設定し、こうして要素に直接設定されたインラインスタイルを上書きすることができます。

実際の実例は?

この種のシナリオは、通常、HTML を完全に制御できない場合に発生します。での解決策を考えてみましょう。 シェアポイント のソリューションを考えてみてください。パートはグローバルに定義(スタイル)されることを望みますが、コントロールできないインラインのスタイルがいくつか存在します。 !important を使うと、そのような状況に対応しやすくなります。

その他にも、実際のシナリオでは、いくつかのひどい jQuery プラグイン もインラインスタイルを使用します。

もうお分かりだと思いますが そして、他のアイデアも思いつくことでしょう。

どのような場合に !important ?

を使用しないことをお勧めします。 !important を使わないことをお勧めします。避けることが可能であれば、いつでも避けましょう。たくさんの !important スタイルをたくさん使うと、メンテナンスが少し大変になります。 カスケード を壊してしまうからです。