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
<ul class=uzivatele> <li> <a href="/uzivatel.php?jmeno=Michales" class=uzivatel> <img width=35 height=35 alt="avatar uživatele Michales" title="Michales" src="http://i.nahraj.to/f/WxU.png"> <img width=10 height=10 class=vlajka alt="český uživatel" title=CZ src="http://stara-cistirna.cz/pronajmy/design/vlajka-cz.jpg"> Michales </a> <li> <a href="/uzivatel.php?jmeno=Michales" class=uzivatel> <img width=35 height=35 alt="avatar uživatele Michales" title="Michales" src="http://i.nahraj.to/f/WxU.png"> <img width=10 height=10 class=vlajka alt="český uživatel" title=CZ src="http://stara-cistirna.cz/pronajmy/design/vlajka-cz.jpg"> Magna </a> <li> <a href="/uzivatel.php?jmeno=Michales" class=uzivatel> <img width=35 height=35 alt="avatar uživatele Michales" title="Michales" src="http://i.nahraj.to/f/WxU.png"> <img width=10 height=10 class=vlajka alt="český uživatel" title=CZ src="http://stara-cistirna.cz/pronajmy/design/vlajka-cz.jpg"> Michales - přihlášený uživatel </a> </ul>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
body { background: #95A6AB; } .uzivatele { list-style: none; padding: 0; /* dále jen pro efekt rámečku */ width: 200px; border: 2px outset #333; border-radius: 5px; } .uzivatel { display: block; height: 50px; line-height: 50px; font-size: 16px; background: url(http://i.nahraj.to/f/WxT.png) left no-repeat; position: relative; margin: 10px; white-space: nowrap; overflow: hidden; color: black; text-decoration: none; } .uzivatel:hover { color: blue; } .uzivatel img { width: 35px; height: 35px; padding: 0 18px 0 7px; vertical-align: -10px; } .uzivatel .vlajka { padding: 0; width: 12px; height: 12px; position: absolute; top: 38px; left: 38px; border-radius: 6px; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>