Tags HTML <h1>-<h6>

Les éléments <h1> à <h6> sont utilisés pour déterminer les 6 niveaux des <Titres HTML>. Le titre le plus important de la page est le titre du premier niveau (<h1>) et le moins important est le titre du sixième niveau (<h6>). Plus le niveau du titre est bas, plus la taille de la police est petite.

Sur chaque page, il ne doit y avoir qu’un seul titre du premier niveau. Les moteurs de recherche l'utilisent pour indexer la structure et le contenu d'une page Web. Par conséquent, pour une meilleure indexation du site, nous vous recommandons d'utiliser des titres thématiques uniques contenant des mots-clés.

Syntaxe

Les tags <h1> -<h6> sont appariés, le tag fermant n’est pas requis.

Comme les tags <h1> à <h6> sont les éléments de bloc, ils sont écrits à partir d'une nouvelle ligne et tous les tags suivants sont transférés à la ligne suivante.

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document </title>
  </head>
  <body>
    <h1>Titre du niveau 1</h1>
    <h2>Titre du niveau 2</h2>
    <h3>Titre du niveau 3</h3>
    <h4>Titre du niveau 4</h4>
    <h5>Titre du niveau 5</h5>
    <h6>Titre du niveau 6</h6>
  </body>
</html>

Résultat

Les éléments <h1>-<h6> ne doivent pas être utilisés pour baliser des sous-titres, des titres alternatifs et des slogans, à moins qu'il ne s'agisse d'un titre pour une nouvelle section ou sous-section.
Comme l'attribut align n'est pas supporté en HTML5, utilisez les propriété CSS font-size et font-weight.

Attributs

Attribut Valeur Description
align left
right
center
justify
Spécifie l'alignement horizontal du contenu du tag.
Non supporté en HTML 5.

Les tags <h1>-<h6> supporte également les Attributs globaux et les Attributs d'événements.

Comment styler le tag HTML <h1>-<h6> ?

Propriétés communes pour modifier le poids visuel/emphase/taille du texte dans le tag <h1>-<h6>:

Coloration du texte dans le tag HTML <h1>-<h6>:

Styles de mise en page du texte pour la tag HTML <h1>-<h6>:

Autres propriétés utiles pour le tag HTML <h1>-<h6>:


Support de Navigateurs



Trouvez-vous cela utile?

Articles Associées