Псевдоклас checked

Псевдоклас checked омогућава да се стилови примењују на означену кутијицу за потврду или радио-прекидач.

Нажалост, стилове за њихово декоративно обликовање није могуће задати. На пример, није могуће задати позadину или боју оквира (могуће је задати, на пример, ширину и висину, али оне неће имати очекивани ефекат).

Упркос томе, могуће је задати стилове за суседне елементе, на пример, овако: input:checked + p - задаћемо стилове за пасус који се налази непосредно испод означеног поља за унос.

Синтакса

cssелемент:checked {
  
}

Пример

Потврдите кутијице и видећете како се црвено боје ознаке label, које се налазе непосредно иза означених кутијица за потврду:

html<input type="checkbox" id="elem1">
<label for="elem1">ознака 1</label>
<br>
<input type="checkbox" id="elem2">
<label for="elem2">ознака 2</label>

cssinput:checked + label {
  color: red;
}

Результат:

Пример

Изаберите радио-дугмад и видећете како се црвено боје ознаке label, које се налазе непосредно иза означеног прекидача:

html<input type="radio" name="elem" id="elem1">
<label for="elem1">ознака 1</label>
<br>
<input type="radio" name="elem" id="elem2">
<label for="elem2">ознака 2</label>

cssinput:checked + label {
  color: red;
}

Результат: