カバーの仕方！重要？

Question

WordPress テンプレートの元の CSS をオーバーライドするカスタム スタイルシートを作成しました。ただし、私のカレンダー ページでは、元の CSS は ! important 宣言を使用して各テーブル セルの高さを設定します。

td {高さ: 100px !重要}

これをオーバーライドする方法はありますか?

Answer 1

style 属性によって設定されたスタイルをオーバーライドすることに加えて、!重要 は、スタイルシート内のセレクターが 特異性と一致する場合にのみ使用されます。 。

ただし、特殊性が矛盾する場合でも、例外に対してより具体的なセレクターを作成することをお勧めします。あなたのケースでは、HTML に class を含めることをお勧めします。これを使用すると、! important ルールを必要としない、より具体的なセレクターを作成できます。

リーリー

私は個人的に、スタイルシートで ! important を使用したことはありません。 CSS の C はカスケードを表すことに注意してください。 #! important を使用すると、これが壊れます。

Answer 2

!重要な修飾子をオーバーライドします

1. ! important を使用して別の CSS ルールを追加し、セレクターにさらに具体性を与えます (セレクターに追加のタグ、ID、またはクラスを追加します)
2. 同じセレクターを持つ CSS ルールを既存のルールの後に追加します (同点の場合、最後に定義されたルールが優先されます)。

より高い特異性を持ついくつかの例 (1 番目がカバー範囲/最も高く、3 番目が最も低い):

リーリー

または、既存のセレクターの後に同じセレクターを追加します:

リーリー

免責事項:

! important を使用することは、ほとんど良い考えではありません。これは、WordPress テンプレート作成者による不適切なエンジニアリングです。これにより、テンプレートのユーザーはテンプレートをオーバーライドするために独自の ! important 修飾子を追加することがウイルス的に強制され、JavaScript を介してテンプレートをオーバーライドするためのオプションが制限されます。

ただし、必要に応じて オーバーライドする方法 を知っておくと便利です。