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
<a href="#"> <img class="obr" src="http://teststranek.kvalitne.cz/images/obrazek-1.jpg" width="170" height="170"> <img class="popis" src="http://teststranek.kvalitne.cz/images/novy-5i.png"> </a>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
a { transition: 0.5s transform; border-radius: 8px; border: 2px solid #CC0000; margin-top: 13px; margin-right: 15px; margin-bottom: 18px; margin-left: 13px; background-color: #FFFFFF; display: inline-block; position: relative; } a:hover { margin-top: 11px; margin-right: 14px; margin-bottom: 18px; margin-left: 12px; border: 3px solid #CC0000; transform: scale(1.3); } a .obr { vertical-align: top; margin: 4px; } a .popis { transition: 0.5s; position: absolute; top: 180px; left: 180px; opacity: 0; width: 10px; } a:hover .popis { position: absolute; top: 10px; left: 50px; opacity: .8; width: 50px; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>