Partage de codes sources - CodesWall.info
HTML4 > Squelette HTML5 + css3 OK! :)
| Titre | Squelette HTML5 + css3 OK! :) | |
| Postée le | 25-10-2011 | |
| Affichée | 358 | |
| Mini-lien | ||
| Description | HTML5 + css3 ca marche! | |
| Etat |  Ne contient pas d'erreurs. |
| Code d'insertion | |||
| Options |
|
||
| Téléchargement |
|
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<title>Bienvenue sur mon site web sur l'informatique</title>
<!--[if lt IE 9]><script src="includes/html5ie.js"></script><![endif]-->
<style>
header
{
width:500px;
border:1px solid #aaa;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius: 10px;
background:#f7f7f7;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
-moz-box-shadow:0 0 15px #aaa;
-webkit-box-shadow:0 0 15px #aaa;
margin:auto;
padding:10px;
}
nav
{
width:500px;
border:1px solid #ccc;
background:#cccccc;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
margin:10px auto;
position:relative;
}
nav ul
{
margin:0;
padding:0;
}
nav ul li
{
list-style-type:none;
padding:5px;
display:inline;
}
section
{
width:500px;
border:1px solid #ccc;
background:#eeeeee;
background:-moz-linear-gradient(90deg, #eee, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee)); /* Webkit */
margin:auto;
padding:10px;
}
footer
{
width:500px;
text-align:right;
font-size:10px;
border:1px solid #aaa;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius: 10px;
background:#f7f7f7;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
margin:10px auto;
padding:10px;
}
</style>
</head>
<body>
<header role="banner">
<strong>MON SITE</strong>
</header>
<nav role="navigation">
<ul>
<li>Accueil</li>
<li>Informatique</li>
</ul>
</nav>
<section role="main">
<h1>Bienvenue</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at nibh nibh, in consequat nisl. Proin neque mi, iaculis eget sodales eu, scelerisque consectetur nisi. Mauris vitae nulla a ipsum sollicitudin egestas. Proin urna orci, porttitor eget dapibus a, dignissim eu quam. Pellentesque sed quam ut libero mattis tincidunt at eu lorem. In pretium bibendum feugiat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
</p>
</section>
<footer>
MON FOOTER
</footer>
</body>
</html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
<title>Bienvenue sur mon site web sur l'informatique</title>
<!--[if lt IE 9]><script src="includes/html5ie.js"></script><![endif]-->
<style>
header
{
width:500px;
border:1px solid #aaa;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius: 10px;
background:#f7f7f7;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
-moz-box-shadow:0 0 15px #aaa;
-webkit-box-shadow:0 0 15px #aaa;
margin:auto;
padding:10px;
}
nav
{
width:500px;
border:1px solid #ccc;
background:#cccccc;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
margin:10px auto;
position:relative;
}
nav ul
{
margin:0;
padding:0;
}
nav ul li
{
list-style-type:none;
padding:5px;
display:inline;
}
section
{
width:500px;
border:1px solid #ccc;
background:#eeeeee;
background:-moz-linear-gradient(90deg, #eee, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#eee)); /* Webkit */
margin:auto;
padding:10px;
}
footer
{
width:500px;
text-align:right;
font-size:10px;
border:1px solid #aaa;
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius: 10px;
background:#f7f7f7;
background:-moz-linear-gradient(90deg, #ccc, #fff); /* Firefox */
background:-webkit-gradient(linear, left top, left bottom, from(#fff), to(#ccc)); /* Webkit */
margin:10px auto;
padding:10px;
}
</style>
</head>
<body>
<header role="banner">
<strong>MON SITE</strong>
</header>
<nav role="navigation">
<ul>
<li>Accueil</li>
<li>Informatique</li>
</ul>
</nav>
<section role="main">
<h1>Bienvenue</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce at nibh nibh, in consequat nisl. Proin neque mi, iaculis eget sodales eu, scelerisque consectetur nisi. Mauris vitae nulla a ipsum sollicitudin egestas. Proin urna orci, porttitor eget dapibus a, dignissim eu quam. Pellentesque sed quam ut libero mattis tincidunt at eu lorem. In pretium bibendum feugiat. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.
</p>
</section>
<footer>
MON FOOTER
</footer>
</body>
</html>
![[Valid RSS]](/design/valid-rss.png)
