CityDesk Weblog

  Accueil Elanceur Aide CityDesk Qu'est-que CityDesk ? Pourquoi ce site ? Galerie ? Contact  

Créer La Barre de Menu avec une Feuille de Style CSS ? Etape 2 - samedi 18 mai 2002

La Feuille de Style étant désormais écrite, il faut l'intégrer dans le code de la page HTML :

Le code HTML standard comprend l'ouverture de deux balises <HTML> et <HEAD> incluant le titre <TITLE> de la page et la balise <META>. Jusque là rien de surprenant (faites un copier-coller de la balise meta...) :

<html>
<head>
<title>Exercice MenuCSS</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

Le chapeau (<HEAD>) du document HTML doit comprendre le lien vers la feuille de style utilisée. Cela établit simplement la relation du lien, son emplacement relatif et le type "mime" (peut-on parler de mimodrame... ;-) de telle manière que le navigateur puisse reconnaître comment jouer avec cet élément. La balise de fermeture du "chapeau" </HEAD> et l'ouverture des balises <BODY> parce que ses propriétés sont héritées de la feuille de style attachée.

<link rel "FeuilleDeStylePrintemps" href="Printemps.css" type="text/css">
</head>
<body>

L'objectif de cet article est de créer une Barre de Navigation. Il faut donc régler les "étiquettes" de style aux balises <A> dans le premier et troisième lien de telle manière que ces propriétés soient ici déterminées. De la même manière, le second lien hérite de la Classe "cettepage" de la balise <p> qui l'encadre. Notez que le code de cette page est réduit à l'essentiel et par conséquent facile à visualiser et éditer. Pour créer le même effet sans feuille de style cela vous prendrait beaucoup plus de temps et rendrait vos futures modifications plus "chronophages" (dévoreuses de temps) et pourrait être aussi une nouvelle source d'erreurs dans le code.

<p><a href="#" class="nav">Page d'Accueil</a></p>
<p class="cettepage">Vous êtes là</p>
<p><a href="#" class="nav">Contactez-moi</a></p>
</body>
</html> 

Accueil Aide CityDesk | Qu'est-ce que CityDesk ? | elanceur conseil | Pourquoi ce Weblog ? | Traductions Joel sur fil RSS xml