【CSS】:checked（擬似クラス） - チェック状態

CSSの擬似クラスの１つ、checkedについてご紹介します。

checked

擬似クラスcheckedはチェックボックスやラジオボタンがONの状態です。

基本構文

:checked {
    プロパティ名: プロパティ値;
}

サンプル

次のサンプルコードはチェックボックスにチェックを入れるとチェック時の色を赤に変更します。

<style>
input:checked {
    accent-color: #ff0000;
}

</style>
<label><input type="checkbox">同意する</label>