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="zapati"> <!-- začátek zápatí --> <div class="background red"></div> <div class="background blue"></div> <div class="background brown"></div> <div class="background aqua"></div> <div>První odstavec je prvním blokem. </div> <div>Druhý odstavec je druhým blokem. </div> <div>Třetí odstavec je třetím blokem. </div> <div>Čtvtý odstavec je čtvrtým blokem. </div> </div> <!-- konec zápatí -->
HTML
Autoformát
Standardní režim
Mobilní zobrazení
#zapati { float: left; width: 100%; margin: 0; padding: 0; position:relative; } #zapati > div { width: 25%; float: left; } .red { background: red; left: 0; } .blue { background: blue; left: 25%; } .brown { background: brown; left: 50%; } .aqua { background: aqua; left: 75%; } .background { position: absolute; top:0; width:25%; height: 100%; z-index:-1; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>