複数要素の a:hover と a:focus にスタイルをあてたいとき、次のようなコードを書いていませんか? .section1 a:hover, .section1 a:focus, .section2 a:hover, .section2 a:focus { color: lightpink; } :is() という擬似クラス関数を使えば、短く、重複のないコードが書けます。 :is(.section1, .section2) a:is(:hover, :focus) { color: lightpink; } また、:is() と同時期に、:where() や :not() の複数要素指定といった便利な機能も使えるようになりました。 本記事では、各機能の基礎から使い方までを、実例を交えて紹介します。 :is()とは何か? :where()とは何か? :not()とは何か? :is()