最近便利なCSSおれおれAdvent Calendar 2023 – 18 日目

あーアレです、疑似セレクターで例外を指定できます。

例

.Button:hover:not(.disabled) {
  background-color: #f00;
}

引数と詳細度

:not(a, b c, d > e + f) のように、カンマ区切りで複数のセレクターを指定できます。

詳細度はその引数で与えられるセレクター群の中で最も高いものになります。:is() と同じです。

なお絶対に該当しないセレクターを指定してむやみやたらと詳細度を上げることもできます。:not(#important #important #super-important) で (3,0,0) とか。やめよう、悪用！

おしまい

スタイル宣言の順序とかで頑張ることもできるけど、こっちの方が意味が通じて良いんじゃないかな。

参考