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="#" class="popsany"> <img src="http://teststranek.kvalitne.cz/images/obrazek-1.jpg"> <h2>Kaple svaté Kláry</h2> </a>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.popsany { position: relative; display: inline-block; background: #def; /* barva pozadí pod obrázkem, použije se, pokud má být jiná, než je pozadí stránky */ } .popsany:hover { visibility: visible; } .popsany h2 { margin: 0; font-family: arial, sans-serif; font-size: 90%; position: absolute; top: 3px; left: 15px; } .popsany img { display: block; /* zruší mezeru pod obrázkem */ filter: alpha(opacity=40); opacity: 0.4; } .popsany:hover img { filter: none; opacity: 1; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>