These are pseudo-classes that can be used to target the state of input elements and more.
This attribute targets the checked radio button or checkbox:
:checked
Any element that can be toggled on or off can use this selector. As of now, these are radio buttons, checkboxes, and options in a selective list.
Here is an example with a checkbox
and a label
value:
<input type="checkbox" checked value="check-value" name="test" /> <label for="test">Check me out</label>
Here is a CSS rule that will target the label only when the checkbox is checked:
input:checked + label { color: #ff0000; }