Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<nav id="hlavicka"> <div class="container"> <a id="logo" href="#">JaPaJP</a> <ul id="menu"> <li><a href="#" class="aktualni">Odkaz</a></li> <li><a href="#">Odkaz</a></li> <li><a href="#">Odkaz</a></li> <li><a href="#">Odkaz</a></li> <li><a href="#">Odkaz</a></li> <li><a href="#">Odkaz</a></li> </ul> </div> </nav>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
body { font-family: Arial, Helvetica, sans-serif, Verdana, Geneva, Source Sans Pro, Tahoma; font-size: 14px; color: #111; background-color: #ccc; margin: 0; padding: 0; } #hlavicka{ height: 56px; background: #415C13; } #hlavicka a { color: #fff; } .container { width: 75%; margin: 0 auto; } #logo { float: left; line-height: 56px; font-size: 2em; text-decoration: none; font-weight: bold; } nav ul { margin: 0; padding: 0; list-style: none; float: right; } nav li { float: left; } nav li a { display: block; line-height: 56px; padding: 0 15px; color: #FFF; text-decoration: none; font-weight: bold; } nav li a:hover, nav li .aktualni { background-color: #D77A13; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>