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
<body> <a href="#"> <div class="foto"> <div class="pruh"> Pěkný prase</div> </div> </a>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.foto { width: 620px; height: 430px; background-image: url(http://www.ireceptar.cz/res/data/241/028837.jpg); position: relative; } .pruh { width: 100%; background-color: rgb(0, 0, 0); background-color: rgba(0, 0, 0, 0.7); position: absolute; bottom: 0; padding: 15px 0px; font-family: sans-serif; font-weight: bold; color: white; text-align: center; } a:hover .foto .pruh { width: 100%; background-color: rgb(0, 153, 204); background-color: rgba(0, 153, 204, 0.7); position: absolute; bottom: 0; padding: 15px 0px; font-family: sans-serif; font-weight: bold; color: white; text-align: center; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>