.card:has(img) { ... } で画像を含むカードにだけスタイルを当てられる。.form:has(:invalid) .submit { opacity: 0.5 } でバリデーションエラー時にボタンを半透明に。
JS で DOM を走査していた処理の大半を CSS に置き換えられる。:has() の引数には相対セレクタを使えるので :has(> img) のような直接子指定も可能。
.card:has(img) { ... } で画像を含むカードにだけスタイルを当てられる。.form:has(:invalid) .submit { opacity: 0.5 } でバリデーションエラー時にボタンを半透明に。
JS で DOM を走査していた処理の大半を CSS に置き換えられる。:has() の引数には相対セレクタを使えるので :has(> img) のような直接子指定も可能。