Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<div class="nastylovani-cudliku"> <input type=radio name=team value="all" id='all' checked><label for='all'>Vše</label> <input type=radio name=team value="rbr" id='rbr'><label for='rbr'>Red Bull Racing</label> <input type=radio name=team value="ferrari" id='ferrari'><label for='ferrari'>Scuderia Ferrari</label> <input type=radio name=team value="mercedes" id='mercedes'><label for='mercedes'>Mercedes GP</label> <input type=radio name=team value="mclaren" id='mclaren'><label for='mclaren'>McLaren</label> </div> <ul> <li class="ferrari mercedes">Michael Schumacher</li> <li class="mclaren ferrari">Fernando Alonso</li> <li class="mclaren ferrari">Kimi Räikkönen</li> <li class="mclaren mercedes">Lewis Hamilton</li> <li class="mclaren">Jenson Button</li> <li class="rbr">Sebastian Vettel</li> <li class="mclaren rbr">David Coulthard</li> <li class="rbr">Mark Webber</li> </ul>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
input:not(:checked) ~ ul li {display: none} input#all:checked ~ ul li {display: list-item} input#rbr:checked ~ ul .rbr {display: list-item} input#ferrari:checked ~ ul .ferrari {display: list-item} input#mercedes:checked ~ ul .mercedes {display: list-item} input#mclaren:checked ~ ul .mclaren {display: list-item} .nastylovani-cudliku {background-color: blue;}
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>