Les blocs HTML

Qu'est-ce qu'un bloc HTML ?

En HTML, une balise de type bloc est un élément qui :

• Occupe toute la largeur disponible (celle de son parent), même si le texte ou le contenu est plus petit.
• Crée un retour à la ligne automatique avant et après son affichage.

Autrement dit, tout ce qui suit s’affiche sur une ligne séparée.

Exemple :

Balises de type bloc par défaut

Voici quelques-unes des balises les plus courantes, toutes de type bloc :

• Structurelles : <header>, <nav>, <main>, <section>, <footer>

• Titres : <h1> jusqu’à <h6>

• Paragraphe : <p>

• Listes : <ol>, <ul>, <li>

• Bloc générique : <div> (souvent utilisé pour grouper du contenu et le styliser via CSS)

Blocs structuraux et de division de page

Chaque bloc a son utilité.

Une page HTML sera toujours construite de la même façon :

Ces blocs principaux contiennent d'autres balises de contenu de page.

Ils servent à :

• structurer la page
• traiter les contenus en blocs par le CSS
• mieux comprendre la page par les moteurs de recherche

Dans ces blocs, on pourra subdiviser le contenu en d'autres grands blocs de contenu grâce aux balises :

• <section> : une division de la page qui inclut au moins un titre et un paragraphe. Indique que le contenu principal comprend des sections indépendantes.
• <div> : une division de la page qui n'est pas une section, mais qui doit être traitée en bloc par le CSS, entre autres.