Exercice HTML : Structure d'une page, titres, paragraphes...

Thème

Réaliser manuellement une page HTML simple : structure de base, titres, paragraphes, ligne de séparation horizontale...

Balises

Références

Donnée de l'exercice

Réaliser la page Web simple illustrée par la copie-écran ci-dessous. Utilisez pour ce faire les 2 outils suivants : Après avoir créé quelques lignes de votre page HTML, sauvegardez-la et ouvrez-la dans Netscape (File>Open Page puis [Choose File]) pour la vérifier. Au fur et à mesure de l'avancement de votre travail, rechargez-la dans Netscape (bouton [Reload this page...] ou View>Reload) pour la contrôler.

Corrigé de l'exercice

 EtapeSolution
1 Structure de base de la page

avec titre du document (apparaissant dans la barre de titre de la fenêtre du browser et dans bookmarks si l'on mémorise cette page)

<HTML>
<HEAD>
   <TITLE>Jules Ducommun</TITLE>
</HEAD>
<BODY>


</BODY>
</HTML>
2 Titre de 1er niveau centré,
titres de second niveau,
ainsi que traits de séparation horizontaux
(le tout inséré dans le "body" de la page !)
<H1 ALIGN=CENTER>Jules Ducommun</H1>
<HR SIZE="7">
<H2>Mes coordonnées</H2>
<HR WIDTH="60%">
<H2>Mon curriculum vitae</H2>
<HR WIDTH="60%">
<H2>Mes hobbies</H2>
3 Quelques lignes de texte avec saut à la ligne forcé

(que se passerait-il si vous ne mettiez pas de <BR>, et quelle est l'effet des caractères "espace", "tab" et "cr" dans du code HTML ?)

Jules Ducommun<BR>
SI-DGR<BR>
EPFL<BR>
CH - 1015 Lausanne
4 Deux "paragraphes" de textes (avec espacement vertical entre paragraphes)
J'ai fréquenté l'école primaire de ...<P>
J'ai suivi ensuite ...
5 Pied de page en italique
(à placer juste avant la balise </BODY>)
<HR>
<I>Jules Ducommun / révision 2.5.99</I>
6 Et comment faire pour que le texte "à remplir..." du chapitre "Mes hobbies" soit invisible au niveau du browser (commentaire HTML) ?
<!-- à remplir... -->


Exercices HTML © J.-D. Bonjour / ENAC-IT1, EPFL / Révision 22.9.2001