1. Les paragraphes
Un document lu, c'est avant tout un document aéré : il faut donc diviser le contenu de votre texte en plusieurs paragraphes. Lorsque vous développez vos pages, il existe deux balises qui permettent d'obtenir, soit un saut de ligne, soit le commencement d'un nouveau paragraphe.
La balise <p> exprime le début d'un paragraphe, c'est à dire un double espace, tandis que la balise <br> effectue un retour à la ligne (simple espace) identique à la touche Entrée de votre clavier (sous traitement de texte). A noter que la balise </p> (fermeture) est facultative tandis que la balise de fermeture de <br> est interdite.
A noter que la balise <br> possède l'attribut clear (trois valeurs : left, right, all) permettant d'insérer un retour à la ligne dès que la marge (gauche, droite, ou les deux) est libre.
Exemple : <br clear=right>
(un retour s'effectue à la ligne dès que la marge de droite est libre).
La balise <p> possède l'attribut align qui sert à aligner le texte et prend 4 valeurs :
- left : Aligne le texte sur la marge de gauche
- right : Aligne le texte sur la marge de droite
- center : Centre le texte entre les marges
- justify : Justifie le texte
Note : L'attribut nowrap permet de ne pas effectuer de retour à la ligne.
Exemple et code source
Ceci est un
<br>
exemple
<p>
avec les balises p et br
Ceci est un
exemple avec les balises p et br
Note : Tout le texte compris entre les balises <nobr> et </nobr> ne contiendra pas de passages à la ligne intempestifs, à utiliser avec parcimonie car le visiteur sera peut être obligé de faire défiler horizontalement la fenêtre de son navigateur, ce qui n'est pas très agréable.
2. Les titres
L'élément h permet de mettre en valeur une portion de texte. Pour cela, le texte doit être encadré par les balises d'ouverture et de fermeture choisies et un retour à la ligne se fera automatiquement. Il y a six niveaux de titre de <h1> (le plus important) à <h6> (le plus petit) et l'élément h possède lui aussi l'attribut align (right, left, center).
Exemple et code source avec chaque balise h :
<h1>Titre de niveau 6</h1>
<h2>Titre de niveau 5</h2>
<h3>Titre de niveau 4</h3>
<h4>Titre de niveau 3</h4>
<h5>Titre de niveau 2</h5>
<h6>Titre de niveau 1</h6>
Titre de niveau 6
Titre de niveau 5
Titre de niveau 4
Titre de niveau 3
Titre de niveau 2
Titre de niveau 1
3. Lignes horizontales (<hr>)
Utiliser des lignes horizontales ou des filets horizontaux est très pratique pour séparer les différentes parties de votre document. Cette méthode s'obtient avec la balise <hr> et ne nécessite pas de balise de fermeture. Elle possède plusieurs attributs :
- align : Permet d'aligner la ligne horizontale. Valeurs : right, left, ou center
- width : Spécifie la largeur de la ligne (en pixels ou % de la fenêtre)
- size : Epaisseur de la ligne (de 1 à 10)
- noshade : S'il est présent, l'effet d'ombre (3d) est annulé
- color : Spécifie la couleur de la ligne (uniquement I.Explorer)
Exemple de plusieurs filets ainsi que leur code source :
<hr width=100 align=left>
<hr width=150 color="blue" align=left>
<hr width=200 color="#ff0000" noshade align=left>
4. La balise <div>
La balise permet de définir l'alignement de plusieurs éléments (titres, textes, images, filets, ...). Elle possède l'attribut align qui prend 4 valeurs : (elle peut donc remplacer la balise <center> qui, elle, permet de centrer plusieurs éléments sur une même page)
- right : Texte aligné à droite.
- left : Texte aligné à gauche.
- center : Texte centré.
- justify : Texte justifié. Exemple :
<div align=left> A noter que depuis la version 4.0 du HTML, la balise <div> se diversifie, en effet elle accepte l'attribut style (feuilles de styles).
Exemple :
<div style="color:green">
5. La balise <blockquote>La balise permet de créer un retrait dans la marge de gauche. Comme les balises <center> et <div> tout élément compris entre les balises d'ouverture et de fermeture bénéficiera de ce retrait.
6. Texte préformatéSi, pour une raison ou une autre, vous ne voulez pas vous servir des balises d'alignement et de paragraphe, la balise <pre> est recommandée. En effet, tout texte compris entre les balises <pre> et </pre> sera transcrit de la même manière. Toutefois, l'utilisation de titre et de mise en forme de paragraphe n'est pas autorisée.
Note : La balise <pre> possède l'attribut width qui permet de spécifier la largeur (en colonnes) de la page. Cet attribut peut prendre 3 valeurs : 40, 80 (par défaut), 132. Toutefois ils existent des différences lors de la visualisation entre entre Netscape et I.Explorer.