Pseudoklas checked

Die pseudoklas checked laat jou toe om 'n gemerkte checkbox of radio te vang.

Ongelukkig kan style vir hul versiering nie gestel word nie. Byvoorbeeld, kan jy nie agtergrond of randkleur stel nie (jy kan wel byvoorbeeld, breedte en hoogte stel, maar hulle sal nie so 'n invloed hê soos wat jy sou verwag nie).

Ten spyte hiervan, kan jy style stel vir aangrensende elemente, byvoorbeeld so: input:checked + p - ons sal style stel vir die paragraaf wat direk onder die gemerkte invoer is.

Sintaksis

csselement:checked {
  
}

Voorbeeld

Merk die checkboxes en jy sal sien hoe die label etikette rooi word, wat direk na die gemerkte checkboxes is:

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

cssinput:checked + label {
  color: red;
}

Результат:

Voorbeeld

Merk die radio en jy sal sien hoe die label etikette rooi word, wat direk na die gemerkte skakelaar is:

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

cssinput:checked + label {
  color: red;
}

Результат: