:is擬似クラス
擬似クラス
機能
同時に複数のセレクタにCSSを適用できる
別な方法で同じ機能を使う場合:セレクタを「,」で区切り複数要素にスタイルを適用する
メリット
記述を簡略化できる
CSSの視認性が向上する
具体例:ピン留めされたリンクカードの本文とアイコンを非表示にするUserCSS
code:css
.grid li.pin .content :is(
.description,
.icon
) {display: none !important;}
方法
.contentの子要素の.descriptionと.iconに設定を適用する
対比::isを使わない場合のCSS
code:css
.grid li.pin .content .description,
.grid li.pin .content .icon {display: none !important;}
情報元
:is() (疑似クラス - 複数のセレクタを引数でまとめて記述する)W3 Watch Reference