Skip to content

Instantly share code, notes, and snippets.

@sandropaganotti-zz

sandropaganotti-zz/index.html

Created September 22, 2011 21:36
Show Gist options
  • Save sandropaganotti-zz/1236124 to your computer and use it in GitHub Desktop.
Save sandropaganotti-zz/1236124 to your computer and use it in GitHub Desktop.
Download ZIP
esempio 1: un layout in HTML
Raw
index.html
<!doctype html>
<html>
<head>
<meta charset='utf-8'>
<title>Edit - Il Blog di HTML.it</title>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<link rel="stylesheet" href="css/default.css" type="text/css">
<![endif]-->
<link rel="stylesheet" href="http://yui.yahooapis.com/3.3.0/build/cssreset/reset-min.css" type="text/css">
<style>
#container{
width: 861px;
margin: 0px auto;
-moz-box-shadow: 3px 0px 20px #888, -3px 0px 20px #888;
-webkit-box-shadow: 3px 0px 20px #888, -3px 0px 20px #888;
box-shadow: 3px 0px 20px #888, -3px 0px 20px #888;
behavior: url(css/PIE.htc); /* http://css3pie.com */
background: white;
}
#ultime_news, #contenuto_principale, #strumenti_e_correlati{
float: left;
}
#container > footer{
clear: both;
}
/* Da rimuovere quando si tolgono i segnaposto */
img.segnaposto{
display: block;
}
</style>
</head>
<body>
<base href="http://sandropaganotti.com/wp-content/goodies/courses/HTML5/">
<div id="container">
<header>
<img src="img/header.jpg" class="segnaposto">
<nav id="menu_primo_livello">
<img src="img/nav.jpg" class="segnaposto">
</nav>
</header>
<aside id="ultime_news">
<img src="img/ultime_news.jpg" class="segnaposto">
</aside>
<section id="contenuto_principale">
<img src="img/contenuto_principale.jpg" class="segnaposto">
</section>
<aside id="strumenti_e_correlati">
<img src="img/strumenti_e_correlati.jpg" class="segnaposto">
</aside>
<footer>
<img src="img/footer.jpg" class="segnaposto">
</footer>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment