:checked следва текущото състояние на избора

Полезно е да знаеш

:checked избира отметнати checkbox и radio контроли, както и избрани option елементи. Състоянието се променя при взаимодействие на потребителя. [1]

Пример: input:checked + label { font-weight: bold; }. Той работи, когато label е непосредственият следващ съсед. Селекторът [checked] проверява наличието на HTML атрибута и не е равнозначен на текущото състояние. Не използвай единствено промяна на цвета, за да покажеш избора; остави и разбираем знак или подходящия нативен контрол. Така визуалната обратна връзка съответства на реалната стойност.