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
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <link rel="stylesheet" href="aaa.css"> <body> <div class="ramecek-obrazek"> <img src="obrazek.jpg" alt="obrazek"> </div> <div class="prvni"> <h1>Sýrové jednohubky</h1> <p>Chutné jednohubky pro každou příležitost</p> <h2>Potřebné suroviny:</h2> <ul> <li>6 rohlíky</li> <li>pomazánkové máslo</li> <li>175g paprikové lučiny</li> <li>70g goudy</li> <li>1 balíček cherry rajčata</li> <li>balení slaných tyčinek</li> <li>salátové listy</li> </ul> <h2>Postup přípravy:</h2> <p>Na rohlíky naneseme zdobicím sáčkem směs pomazánkového másla a <br> lučiny. </p> <p class="autorka"> <b>Autorka receptu:</b> <br> <b>Kamila Nová, Brno</b> <br> </p> </div> <p class="podpis">...</p> </body> </html>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
body{ background-color: yellow; margin: auto; font-size: 1rem; } .autorka{ text-align: right; } .prvni{ max-width: 510px; margin: 1rem; padding: 1rem; background-color: white; text-align: left; border: 5px solid black; } .podpis{ max-width: 510px; margin: 1rem; padding: 1rem; text-align: center; color: red; border: 5px solid black; background-color: white; } h1{ text-align: center; } img{ max-width: 100%; } .ramecek-obrazek { border: 5px solid red; text-align: center; max-width: 510px; margin: 1rem; padding: 1rem; } html{ 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>