私は、Wordpress テンプレートの元の CSS を上書きするカスタム スタイル シートを作成しました。ただし、カレンダー ページでは、元の CSS で各テーブル セルの高さが次の宣言で設定されています!important
。
td {height: 100px !important}
これを上書きする方法はありますか?
ベストアンサー1
!important 修飾子のオーバーライド
- で別のCSSルールを追加し
!important
、セレクタの詳細度を高めます(セレクタにタグ、ID、またはクラスを追加します)。 - 既存のものよりも後の時点で同じセレクターを持つ CSS ルールを追加します (同点の場合は、最後に定義されたものが優先されます)。
より詳細度の高い例をいくつか示します (1 番目が最高/オーバーライド、3 番目が最低):
table td {height: 50px !important;}
.myTable td {height: 50px !important;}
#myTable td {height: 50px !important;}
または、既存のセレクターの後に同じセレクターを追加します。
td {height: 50px !important;}
免責事項:
を使用することは、ほとんどの場合、良い考えではありません!important
。これは、WordPress テンプレートの作成者による不適切なエンジニアリングです。これは、テンプレートのユーザーに、!important
それを上書きするための独自の修飾子を追加することを強制し、JavaScript 経由でそれを上書きするオプションを制限します。
しかし、場合によってはそれを上書きする方法を知っておくと便利です。