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 id="LOGO"> <div id="BETA"> <h3>WEB JE V BETE</h3> </div> </div> <div id="menu"> <center> <ul class="Menu"> <li><a href="index.php">Home</a> </li> <li><a href="product.php">Produkty</a> <ul> <li><a href="product.php?mobile_Accessories">Mobilne prislusenstvo</a> <ul> <li><a href="product.php?Obaly">Obaly</a> </li> <li><a href="product.php?Púzdra">Púzdra</a> </li> <li><a href="product.php?Reproduktory">Reproduktory</a> </li> <li><a href="product.php?Batérie">Batérie</a> </li> <li><a href="product.php?Káble_a_adaptére">Káble a adaptére</a> </li> <li><a href="product.php?Nabíjače">Nabíjače</a> </li> <li><a href="product.php?Headsety">Headsety</a> </li> <li><a href="product.php?Ochrana_displeja">Ochrana displeja</a> </li> <li><a href="product.php?Perá">Perá</a> </li> </ul> </li> <li><a href="product.php?Pc_doplnky">Pc doplnky</a> <ul> <li><a href="product.php?Radiče">Radiče</a> </li> <li><a href="product.php?TV_karty">TV karty</a> </li> <li><a href="product.php?Zvukové_karty">Zvukové karty</a> </li> </ul> </li> <li><a href="product.php?Ostatné">Ostatné</a> <ul> <li><a href="product.php?Led_pási">Led pási</a> </li> <li><a href="product.php?Hodinky">Hodinky</a> </li> <li><a href="product.php?Nože">Nože</a> </li> <li><a href="product.php?Kancelárske_potreby">Kancelárske potreby</a> </li> </ul> </li> </ul> </li> <li><a href="Kontakt.php">Kontakt</a> </li> <li><a href="about.php">Info</a> </li> </ul> </center> </div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.menu li{ text-align: center; background: #8ECCF0; } .menu a{ width: 150px; display: inline-block; padding: .3em 1em; text-decoration: none; background: #fff; } ul { list-style: none; margin: 0; padding: 0; } ul li { display: inline-block; } li > ul { display: none; position: absolute; width: 150px; background-color:#FFF; } li:hover > ul { display: block; } li li { display: block; position: relative; } li ul ul { left: 150px; top: 0; } li:hover > ul > ul{ } #menu{ width: auto; margin: 0 auto; margin-top: 5px; height: auto; background-color: #FFF; border:solid black 4px; } #BETA{ //position:absolute; width: 250px; height: 20px; } #LOGO{ width: auto; height: 150px; background-color:#3F0; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>