“:focus-within”擬似クラス

“:focus-within”擬似クラス

“:focus-within”擬似クラスはその要素もしくは子孫要素がフォーカスされている要素を選択する擬似クラスです。

“:focus”擬似クラスとほぼ同様です。ただし、“:focus”擬似クラスはその要素自体がフォーカスされている時にだけ選択されますが、“:focus-within”擬似クラスは子孫要素がフォーカスされている場合にも要素を選択します。

使用例

<fieldset class="sample">

<p><label for="sample">猫が好きですか？：</label></p>
<p><input type="text" id="sample"></p>

</fieldset

猫が好きですか？：

仕様書

定義されている仕様書

:focus-within