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
<head> <meta charset="utf-8"> <title>Test</title> <link rel="stylesheet" type="text/css" href="css/test.css"> </head> <body> <div id="wrapper"> <div class="sloupce"><p> <h2>DIV 1</h2> Lorem ipsum</br> dolor sit amet,</br> consectetuer adipiscing elit.</br> Lorem ipsum</br> dolor sit amet,</br> consectetuer adipiscing elit.</br> Lorem ipsum</br> dolor sit amet,</br> consectetuer adipiscing elit.</br> </p> </div> <div class="sloupce"><p> <h2>DIV 2</h2> Lorem ipsum dolor sit amet,</p> </div> <div class="sloupce"><p> <h2>DIV 3</h2> Lorem</br> ipsum dolor sit</br> amet, consectetuer adipiscing</br> elit. Nunc dapibus</br> tortor vel mi</br></p> </div> <div class="sloupce"><p> <h2>DIV 4</h2> Lorem ipsum dolor sit</br> amet, consectetuer</br></p> </div> <div class="sloupce"><p> <h2>DIV 5</h2> Lorem ipsum dolor sit amet</br> consectetuer</br> adipiscing elit. Nunc dapibus tortor</br> vel mi dapibus sollicitudin.</br> Curabitur vitae</br> diam non</br> </p> </div> <div class="sloupce"><p> <h2>DIV 6</h2> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc dapibus tortor vel mi dapibus sollicitudin. Curabitur vitae diam non enim vestibulum interdum. Duis ante orci, molestie vitae vehicula venenatis, tincidunt ac pede.</p></div> </div> </body> </html>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
* { margin: 0; padding: 0; } body { font-family: Arial, Helvetica, sans-serif; font-weight:normal; text-decoration:none; list-style:none; } h2 { text-align:center; color: #FFFFFF; } #wrapper { width:1100px; height: auto; background: #FFC2C2; float:left; } .sloupce { width: 350px; height:auto; float:left; background: #CC0000; margin:5px; }
CSS
Autoformát
CSS reset
Až na konci
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>