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 PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; windows-1250" /> <link type="text/css" rel="stylesheet" href="mystyle.css"/> </head> <body> <div class="container dark"> <div class="wrapper"> <ul> <li><a href="#">URL</a></li> <li><a href="#">URL</a></li> <li><a href="#">URL</a></li> <li><a href="#">URL</a></li> <li><a href="#">URL</a></li> </ul> </div> </div> <div class="container ohraniceni2"> <div class="wrapper2"> Lorem Ipsum je demonstrativní výplňový text používaný v tiskařském a knihařském průmyslu. Lorem Ipsum je považováno za standard v této oblasti už od začátku 16. století, kdy dnes neznámý tiskař vzal kusy textu a na jejich základě vytvořil speciální vzorovou knihu. Jeho odkaz nevydržel pouze pět století, on přežil i nástup elektronické sazby v podstatě beze změny. Nejvíce popularizováno bylo Lorem Ipsum v šedesátých letech 20. století, kdy byly vydávány speciální vzorníky s jeho pasážemi a později pak díky počítačovým DTP programům jako Aldus PageMaker. </div> </div> <div class="container dark"> <div class="wrapper"> footer </div> </div> </body> </html>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
* { margin:0px; padding:0px; } html, body { height: 100%; padding: 0; margin: 0; } .container { // background-color:#999999; width:100%; } .wrapper { width:900px; // background-color:red; margin:auto; } .wrapper2 { width:930px; // background-color:red; margin:auto; } .dark { // background-color:#31353d; background-color:#1565C0; color:white; } .ohraniceni2 { // background-color:#31353d; background-color:white; // color:white; width:930px; margin:auto; margin-top:5px; margin-bottom:5px; border:1px solid red; padding:0px; /* -- minimalni vyska stranky -- */ // min-height: 100%; } .light { // background-color:#e9edf2; background-color:#2196F3; } #top_left { display:inline-block; // border:1px solid red; } #top_right { float:right; } #top_div { height:40px; line-height:40px; } #down_div { height:30px; line-height:30px; } #textstyle { height:30px; border-radius:8px; padding-left:4px; } #clear { clear:both; } ul { // background-color:red; } ul li { // background-color:green; width:170px; display:inline-block; height:35px; line-height:35px; text-align:center; } .pager { // background-color:red; } .pager li { // background-color:green; width:30px; display:inline-block; height:35px; line-height:35px; text-align:center; padding:1px; border-radius:6px; border:1px solid blue; } .pager li a { color:black; text-decoration:none; display:block; } .pager li a:hover { background-color:green; color:black; } ul li a { color:white; text-decoration:none; display:block; } ul li a:hover { background-color:orange; color:black; } p {margin-top: 10px; margin-bottom: 15px; text-align:center; } h1 {padding-top: 20px; margin-bottom: 15px; 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>