Pseudo-trieda checked slúži na štýlovanie elementu pri jeho označení "checked". CSS kód je samozrejme určený pre top prehliadače ako Opera a Firefox. V Opere funguje tento kód najlepšie a vo Firefoxe vykazuje menšiu chybu, ktorá sa ale dá uniesť. Prehliadač Internet Explorer ani nespomínam, pretože je nepožiteľný.
CSS kód:
div#nice-check input[type=checkbox], input[type=checkbox] + span
{
background:red;
}
div#nice-check input[type=checkbox]:checked, input[type=checkbox]:checked + span
{
background:yellow;
}
XHTML kód:
<div id='nice-check'> <p><input type='checkbox' checked='checked' /><span>Checkbox 1</span></p> <p><input type='checkbox' checked='checked' /><span>Checkbox 2</span></p> <p><input type='checkbox' /><span>Checkbox 3</span></p> </div>Firefox vs. Opera
firefox.png
opera.png
Firefox vykazuje chybu v tom, že nevie vyfarbiť vnútro elementu input (myslím typ checkbox). Celý výsledok si môžete prezrieť tu.