block, inline

Tous les éléments HTML ont une valeur d'affichage par défaut. Cette valeur est inline ou block pour la plupart des éléments.

Eléments de type block

Un élément de type block débute toujours sur une nouvelle ligne et occupe toute la largeur disponible.

Exemples d'éléments de type block par défaut :

  • Élément délimité par les balises <div> et </div>. Un élément div est un élément de type block "générique" : aucune sémantique n'est associée à cette balise. On utilise donc cette balise à chaque fois que les balises "sémantiques" de type block ne conviennent pas.
  • Élément délimité par les balises <section> et </section>.
  • Élément délimité par les balises <p> et </p> pour délimiter un paragraphe.
  • Élément délimité par les balises <h1> et </h1> pour délimiter un titre (et de même pour h2, h3, h4, h5, h6).
  • Élément délimité par les balises <article> et </article>.
  • ...

Les éléments de type inline

Un élément de type inline ne commence pas sur une nouvelle ligne (mais s'inscrit à la suite de la ligne en cours) et n'occupe pas toute la largeur de l'élément parent : il n'occupe que la largeur nécessaire à l'affichage de son contenu.

Exemples d'éléments de type inline par défaut :

  • Elément délimité par les balises <span> et </span>. Un élément span est un élément de type inline "générique" : aucune sémantique n'est associée à cette balise.
  • Elément img pour embarquer une image dans la page.
  • Elément ancre délimité par les balises <a> et </a>.
  • ...

Un élément de type inline ne peut pas contenir un élément de type block.