Gabarit 04

À propos du gabarit 04

Code HTML et CSS

Ce gabarit est structuré de la manière suivante:

<div id="global">
	<header id="entete">...</header>
	<nav id="navigation">...</nav>
	<main id="contenu">...</main>
	<footer id="pied">...</footer>
</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. modele04.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.

2. Le bloc de droite n'utilise pas la propriété float, mais une simple marge à gauche (margin-left).

   Pour mieux comprendre le fonctionnement du positionnement flottant, vous pouvez, avec un outil tel que Firebug, désactiver la marge de gauche de div#contenu.