Struttura 07

Caratteristica intestazione, corpo e piede di pagina separato, menu verticale a sinistra finte colonne, larghezza fixe 750px

A proposito della struttura 07

Code HTML et CSS

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:

  1. base.css (mise en forme minimale du texte, commune à tous les gabarits)
  2. modele07.css , qui contient tous les styles propres à ce gabarit, et que je vous invite à consulter.

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»).

À noter

  1. 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).

  2. 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.

  3. 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.