TOP > IT・テクノロジー > CSSの否定疑似クラス「:not()」で、複数のclassを指定する場合の使い方 | コリス

CSSの否定疑似クラス「:not()」で、複数のclassを指定する場合の使い方 | コリス

11コメント 2019-07-30 11:32  コリス

:not()セレクタは非常に便利です。例えば、リストの各アイテムの区切りにボーダーをつける時、まずはli要素にボーダーを指定し、最後のli要素にだけボーダー無しを上書きで指定する、そんな時に使用すると

ツイッターのコメント(11)

お、複数classを連鎖させるの知らなかった。見た目はメソッドチェーン風
cssのnotセレクタについての小技。ニッチですが便利そうなので
便利そうなのでメモ。「:not()セレクタは非常に便利です」「:not()セレクタは通常一つのclassしか指定できませんが、複数のclassを指定する場合の使い方を紹介します」。◆ | コリス
:not擬似クラス、メニューの現在地だけスタイル変えるところとか使えそう。
「お前とお前とお前以外は全員帰れ!」という時用のCSS指定。
今まで複数指定する状況には出くわさなかったけど、できるとは知らなかった。
これは便利。
いままで細々と:last-childや個別のクラスを作って対応していたけど、これだとより直感的な指定が可能になる。
ここだけこの装飾やめたいんだけど、、という所で、いちいち別クラス指定しなくてもうち消せます。使うと時はサポートブラウザはチェックしてから。
お、not連打以外に方法あったのか!?と思ったらnot連打だった😌
「:not()」使ったことなかったけど使おうかなって思った。
以上
 

いま話題のニュース

もっと読む
PR