Caratteristica intestazione, corpo e piede di pagina separato, menu verticale a sinistra finte colonne, larghezza fixe 750px
questa struttura e composta come segue:
<div id="global">
<div id="entete">...</div>
<div id="centre">
<div id="navigation">...</div>
<div id="contenu">...</div>
</div>
</div>
Il est mis en forme par deux feuilles de styles:
Pour voir le détail du code HTML de cette page, utilisez la fonction d'affichage de la source de votre navigateur web (ex: «Affichage > Code source de la page»).
Dans ce gabarit, nous utilisons la propriété CSS
float
pour placer deux blocs à la même hauteur plutôt
que l'un en dessous de l'autre. Voir les notes de la feuille de
style du gabarit pour en savoir plus.
Le bloc de droite n'utilise pas la propriété
float
, mais une simple marge à gauche
(margin-left
).
Ce gabarit utilise la technique des colonnes
factices pour afficher deux colonnes de même hauteur
quelle que soit la hauteur des contenus. On utilise donc une
image de fond (07-colonnes.png),
répétée en hauteur et appliquée au conteneur
div#centre
.
Pour éviter que les colonnes ne «débordent» de leur
conteneur, il est nécessaire de gérer le
dépassement des flottants (dans ce gabarit, on utilise
div#centre
pour cela — voir les styles du
gabarit pour les détails).
Contenuto piede di pagina. Nulla tincidunt tincidunt mi. Curabitur iaculis, lorem vel rhoncus faucibus, felis magna fermentum augue, et ultricies lacus lorem varius purus. Curabitur eu amet.
Mise en page © 2008 Elephorm et Alsacréations