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> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <link rel="stylesheet" type="text/css" href="stylymobil1.css" /> </head> <body> <div id="wrap"> <div id="menu"> <div id="hamburger"> Menu<br><br><br> <ul> <li>XXXX</li> <li>XXX</li> <li>XXXXX</li> <li>XXXXX </li> <li>XXXXXX</li> </ul> </div> </div> <div id=header> </div> <div id="section"> </div> <div id="footer"> </div> </div> </body> </html>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
body{ margin:0 auto; } #wrap{ width:100%; max-width:700px; height:auto; margin:0 auto; } #menu{ max-width:700px; width:100%; height:45px; background-color:black; background-repeat: repeat-x; background-position:center center; float:right; color:white; display:inline-block; text-align:center; z-index:1; } #hamburger{ margin:0 auto; text-align:center; max-width:700px; display:block; } #hamburger ul{ margin-top:100px; max-width:700px; text-align:center; margin:0 auto; } #hamburger li { font-family: Impact, Charcoal, sans-serif; font-size:35px; color:white; max-width:700px; width:100%; list-style-type:none; background-color:black; text-align:center; border-bottom:solid #2a2a2a 1px; padding-top:10px; padding-bottom:10px; display:block; position:relative; } #header{ max-width:700px; width:100%; height:350px; background-repeat: no-repeat; background-position:center center; background-color:purple; border-bottom:solid black 2px; margin:0 auto; text-align:left; } #section{ max-width:700px; width:95%; height:auto; min-height:800px; margin-left:auto; margin-right:auto; margin-top:90px; text-align:center; } #footer{ max-width:700px; width:100%; height:90px; background-color:black; clear:both; color:white; font-family: "Century Gothic", sans-serif; 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>