Pseudotrieda checked

Pseudotrieda checked umožňuje zachytiť označené zaškrtávacie políčko alebo rádio.

Bohužiaľ, štýly pre ich ozdobenie nie je možné nastaviť. Napríklad nie je možné nastaviť pozadie alebo farbu okraja (možno nastaviť napríklad šírku a výšku, ale budú mať iný vplyv, ako by sa dalo očakávať).

Napriek tomu je možné nastaviť štýly pre susedné prvky, napríklad takto: input:checked + p - nastavíme štýly pre odsek, ktorý sa nachádza priamo pod označeným vstupom.

Syntax

prvok:checked {
	
}

Príklad

Označte zaškrtávacie políčka a uvidíte, ako sa zafarbia červenou farbou štítky label, ktoré sa nachádzajú priamo po označených zaškrtávacích políčkach:

<input type="checkbox" id="elem1">
<label for="elem1">štítok 1</label>
<br>
<input type="checkbox" id="elem2">
<label for="elem2">štítok 2</label>

input:checked + label {
	color: red;
}

Príklad

Označte rádio a uvidíte, ako sa zafarbia červenou farbou štítky label, ktoré sa nachádzajú priamo po označenom prepínači:

<input type="radio" name="elem" id="elem1">
<label for="elem1">štítok 1</label>
<br>
<input type="radio" name="elem" id="elem2">
<label for="elem2">štítok 2</label>

input:checked + label {
	color: red;
}