Selektory pseudoklas

Zaznaczenie

(CSS 3 - interpretuje Internet Explorer 9, Firefox, Opera, Chrome)

selektor:checked { cecha: wartość }

Niektóre z pól formularzy pełnią rolę przełączników - można je zaznaczać i odznaczać. W związku z tym może się okazać przydatne dodatkowe wizualne wyróżnienie tych kontrolek, które użytkownik zaznaczył.

Zaznaczenie dla opcji listy rozwijalnej obsługuje tylko Firefox.

Przykład:

Po wpisaniu w arkuszu stylów:

input:checked, option:checked { margin-left: 30px }

a w dowolnym miejscu strony:

<form action="?">
	<fieldset>
	<input type="radio" checked="checked" name="pole_opcji" />
	<input type="radio" name="pole_opcji" />
	</fieldset>
	<fieldset>
	<input type="checkbox" checked="checked" />
	<input type="checkbox"  />
	</fieldset>
	<select size="3">
	<option selected="selected">Opcja 1</option>
	<option>Opcja 2</option>
	<option>Opcja 3</option>
	</select>
</form>

otrzymamy formularz, w którym zaznaczone pola mają dodatkowy margines z lewej strony (aby to sprawdzić zmień zaznaczenie wybranych kontrolek):

Opcja 1 Opcja 2 Opcja 3

Zaznaczona opcja listy rozwijalnej (ostatnia z powyższych kontrolek) będzie wyróżniona najprawdopodobniej tylko w przeglądarce Firefox.

• Tylko do odczytu
• Domyślne

• Do góry
• Strona główna
• Drukuj rozdział
• Komentarze