Ψευδοκλάση checked

Η ψευδοκλάση checked επιτρέπει την επιλογή ενός επιλεγμένου checkbox ή radio.

Δυστυχώς, δεν μπορούν να οριστούν στυλ για διακόσμησή τους. Για παράδειγμα, δεν μπορείτε να ορίσετε φόντο ή χρώμα περιθωρίου (μπορείτε να ορίσετε, για παράδειγμα, πλάτος και ύψος, αλλά δεν θα έχουν την επίδραση που θα περιμένατε).

Παρ' όλα αυτά, μπορείτε να ορίσετε στυλ για γειτονικά στοιχεία, για παράδειγμα, έτσι: input:checked + p - θα ορίσουμε στυλ για την παράγραφο, που βρίσκεται αμέσως μετά το επιλεγμένο input.

Σύνταξη

στοιχείο:checked {
	
}

Παράδειγμα

Επιλέξτε τα checkboxes και θα δείτε πώς ανάβουν με κόκκινο χρώμα οι ετικέτες label, που βρίσκονται αμέσως μετά τα επιλεγμένα checkboxes:

<input type="checkbox" id="elem1">
<label for="elem1">ετικέτα 1</label>
<br>
<input type="checkbox" id="elem2">
<label for="elem2">ετικέτα 2</label>

input:checked + label {
	color: red;
}

Παράδειγμα

Επιλέξτε radio και θα δείτε πώς ανάβουν με κόκκινο χρώμα οι ετικέτες label, που βρίσκονται αμέσως μετά τον επιλεγμένο διακόπτη:

<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>

input:checked + label {
	color: red;
}