<!DOCTYPE
html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Language"
content="fr">
<title>Création d'une page en css</title>
<style>
/* ici le cadre */
moncadre {
width:800px;
margin:auto;
padding:10px;
background-color:#FFFF00;
border-left:1px solid #000000; /* couleur du cadre */
border-right:1px solid #000000;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
}
/* ici le cadre
haut */
cadrehaut {
height:100px;
background-color:#FFCCCC;
margin-bottom:10px;
}
/* ici le menu de
gauche */
.cadremenugauche {
float:left;
text-align:left;
width:150px;
padding:10px;
background-color:#FBFBFF;
border:1px solid #000000;
color:#666666;
}
/* ici le menu de
droite */
.cadremenudroite {
float:right;
text-align:left;
width:150px;
padding:10px;
background-color:#FBFBFF;
border:1px solid #000000;
color:#666666;
}
</style>
</head>
<body>
<div id="moncadre">
<div id="cadrehaut">texte du cadre du haut
</div>
<div class="cadremenugauche">texte du menu gauche
</div>
<div class="cadremenudroite">texte du menu droite
</div>
Texte de la partie centrale
</div>
</body>
</html>
Voir
le résultat du style