Pseudo-klassen checked

Pseudo-klassen checked gør det muligt at fange et markeret afkrydsningsfelt eller radio.

Desværre kan stilarter til deres udsmykning ikke angives. For eksempel kan man ikke angive baggrund eller randfarve (man kan angive f.eks. bredde og højde, men de vil have en anden effekt, end man måske ville forvente).

På trods af dette kan man angive stilarter for tilstødende elementer, for eksempel sådan: input:checked + p - vi angiver stilarter for afsnittet, som placeres umiddelbart under den markerede input.

Syntaks

csselement:checked {
  
}

Eksempel

Marker afkrydsningsfelterne, og du vil se, hvordan etiketterne label lyser rødt, som placeres umiddelbart efter de markerede afkrydsningsfelter:

html<input type="checkbox" id="elem1">
<label for="elem1">etikette 1</label>
<br>
<input type="checkbox" id="elem2">
<label for="elem2">etikette 2</label>

cssinput:checked + label {
  color: red;
}

Результат:

Eksempel

Marker radio, og du vil se, hvordan etiketterne label lyser rødt, som placeres umiddelbart efter den markerede knap:

html<input type="radio" name="elem" id="elem1">
<label for="elem1">etikette 1</label>
<br>
<input type="radio" name="elem" id="elem2">
<label for="elem2">etikette 2</label>

cssinput:checked + label {
  color: red;
}

Результат: