Псевдокласс checked

Псевдокласс checked чекбокстун же radio-нун белгиленген абалын кармоого мүмкүндүк берет.

Тилекке каршы, аларды кооздоо үчүн стилдерди белгилөө мүмкүн эмес. Мисалы, фон же чейранын түсүн белгилөө мүмкүн эмес (мисалы, туурасы жана бийиктигин белгилесе болот, бирок алар күтүлгөндөй натыйжа бербейт).

Бул болсо да, коңшу элементтер үчүн стилдерди белгилесе болот, мисалы, мындайча: input:checked + p - белгиленген инпутун төмөнкү абзац үчүн стилдерди белгилейбиз.

Синтаксис

элемент:checked {
	
}

Мисал

Чекбокстарды белгилеп көрүңүз, анда сиз label белгилеринин кантип кызыл түскө өткөнүн көрө аласыз, алар белгиленген чекбокстордун төмөнүндө турат:

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