Voici quelques balises et attributs qui amélioreront la présentation des pages.
Définir différentes tailles de titres
<h1> Titre de niveau 1</h1>
<h2> Titre de niveau 2</h2>
<h3> Titre de niveau 3</h3>
<h4> Titre de niveau 4</h4>
<h5> Titre de niveau 5</h5>
<h6> Titre de niveau 6</h6>
Titre 1
Titre 2
Titre 3
Titre 4
Titre 5
Titre 6
Aligner les titres
Comme pour les lignes et les paragraphes, il est aussi possible de spécifier des attributs d’alignement pour les titres.
<h1 align= »left »>Titre 1 aligné à gauche</h1>
<h2 align= »center »>Titre 2 aligné au centre</h2>
<h3 align= »right »>Titre 3 aligné à droite</h3>
Styles de texte
Pour mettre en valeur des mots importants, on peut utiliser les styles tels que gras, italique, etc.
Principaux styles de texte
Styles | Balise de début | Balise de fin |
---|---|---|
Gras | <b> | </b> |
Italique | <i> ou <em> | </i> ou </em> |
Souligné (à éviter car prête à confusion avec les liens hypertextes) | <u> | </u> |
Courier | <tt> | </tt> |
Barré | <strike> | </strike> |
Préformaté | <pre> | </pre> |
Citation | <blockquote> | </blockquote> |
Mise en forme de code | <code> | </code> |
<em> et <strong>
Ces deux balises peuvent remplacer <i> et <b> mais sous Linux elles souligneront également le texte.
Préformaté
Généralement affiché avec une police à espacement fixe, le plus souvent la police Courier, ce style peut être utilisé pour créer rapidement des tableaux en gérant correctement les espaces.
Mettre un texte en exposant ou en indice
Les exposants sont pratiques pour écrire des dénominations (Mlle, 20ème.) ou pour inclure des notes de renvoi vers un pied de page par exemple.
Chiffre en <sup>exposant</sup>
Chiffre en <sub>indice</sub>
Texte défilant (ne pas en abuser)
La balise <marquee> permet de faire défiler un texte dans la direction de son choix.
<marquee bgcolor= »green » width= »95% » direction= »right loop= »0″>Votre message</marquee>
bgcolor : couleur de la boîte qui contient le texte défilant
width : taille de la boîte par rapport à la largeur de la page
direction : sens du défilement
loop=0 : nombre de répétitions (0=défilement continu)
Exercice 8 : combiner les mises en forme
Exemple à personnaliser :
On veillera bien à respecter l’ordre d’imbrication des balises, la première ouverte étant la dernière fermée et ainsi de suite.
<p>
Le 1<sup>er</sup> salon eut lieu <i>en janvier 1875</i>.
</br>
L'inauguration eut lieu en présence de <b>Monsieur
le Maire.</b>
</p>
<blockquote>L'équipe organisatrice fut très étonnée
par le grand nombre de visiteurs.</blockquote>
Enregistrer au format exercice-8.html
puis ouvrir dans le navigateur.
Dans le prochain article, il sera question des caractères spéciaux.