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"> <title>Malazská encyklopedie</title> <link rel="stylesheet" type="text/css" href="temps/styles.css"> <script type="text/javascript" src="defines/scripts.js"></script> </head> <body> <div class="background"> <div class="header"> <div class="header_image"> <div class="header_menus"> </div> </div> <div class="header_bottom"> </div> </div> <div class="content"> <div class="menu_left"> <div class="menu_block"> <div class="menu_block_top">Systém</div> <div class="menu_block_middle"> <a href="index.php">Index</a><br> <a href="index.php?sec=login&action=login">Přihlásit</a> <br> <br><a onClick='showHide("left_system_submenu")'>Systém</a><br> <div class="submenu" id="left_system_submenu"> Ohlásit chybu<br> Buglist<br> Todo list<br><br> Kredit<br> FAQ<br> </div> </div> <div class="menu_block_bottom"></div> </div> <div class="menu_block"> <div class="menu_block_top">Uživatelé</div> <div class="menu_block_middle"></div> <div class="menu_block_bottom"></div> </div> <div class="menu_block"> <div class="menu_block_top">Databáze</div> <div class="menu_block_middle"></div> <div class="menu_block_bottom"></div> </div> </div> <div class="menu_right"> <div class="menu_block"> <div class="menu_block_top">Vyhledávání</div> <div class="menu_block_middle"> </div> <div class="menu_block_bottom"></div> </div> <div class="menu_block"> <div class="menu_block_top">Statistiky</div> <div class="menu_block_middle"></div> <div class="menu_block_bottom"></div> </div> <div class="menu_block"> <div class="menu_block_top">Odkazy</div> <div class="menu_block_middle"></div> <div class="menu_block_bottom"></div> </div> </div> <div class="body"> <div class="body_top"> </div> <div class="body_middle"> This is index! </div> <div class="body_bottom"></div> </div> </div> <div class="footer"> <div class="footer_top"> </div> <div class="footer_main"></div> </div> </div> </body> </html>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
/* * Author: Jelec * Page: CSS sheet * Description: Style sheets. */ body { margin: 0 0 0 0; background-color: red; } .background { height: 100%; width: 100%; } .header { width:100%; background-color: aqua; height:200px; } .header_image { height: 90%; background-color: yellow; } .header_menus { margin: 0 auto; position: relative; top: 30%; width: 50%; height: 50%; background-color: purple; } .header_bottom { background-color: black; width: 100%; height: 10%; } .content { width: 1400px; background-color: maroon; margin: 0 auto; } .body { width: 70%; background-color: pink; margin: 0 auto; word-wrap: break-word; } .body_top { width: 100%; height: 50px; background-color: chocolate; } .body_middle { background-color: coral; padding-left: 20px; padding-right: 20px; } .body_bottom { width: 100%; height: 50px; background-color: green; clear: both; } .footer { width: 100%; height: 100px; background-color: firebrick; } .footer_top { width: 100%; height: 30px; background-color: grey; } .footer_main { width: 100%; height: 70px; background-color: magenta; } .menu_left { text-align: center; background-color: tomato; width: 15%; position: relative; left: 0px; top: 30px; float: left; } .menu_right { text-align: center; background-color: tomato; width: 15%; position: relative; right: 0px; float: right; top: 30px; } .menu_block { margin: 0 auto; width: 80%; background-color: aliceblue; position: relative; margin-top: 20px; margin-bottom: 40px; } .menu_block_top { font-size: 24px; } .menu_block_middle { font-size: 18px; } .submenu { font-size: 14px; display: none; }
CSS
Autoformát
CSS reset
Až na konci
/* * Author: Jelec * Page: Javascript scripts. * Here are located Javascript scripts used globally. */ function showHide(id) { elementStyle = document.getElementById(id).style; elementStyle.display = (elementStyle.display == "block") ? "none" : "block"; } function checkRegistForm() { }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>