,

et des deux paragraphes

. C’est
aussi un ancêtre de l’élément .
• Le second bloc

est parent de l’élément .
• Les titres

,

et les deux paragraphes

sont frères.
Cette hiérarchie structurante permet une mise en page plus fine. On écrira de même
les feuilles de styles de manière hiérarchique. Elle présente un autre avantage : un
document bien hiérarchisé doit s’afficher de manière tout à fait lisible et fonctionnelle, même en l’absence de styles CSS (et donc de mise en page) – par exemple s’ils
sont désactivés.
Comprendre la notion de flux du document
Les différents éléments d’une page, emboîtés ou juxtaposés selon qu’ils sont respectivement parents et enfants ou frères, prennent par défaut place dans le « flux courant »
du document, aussi appelé « flux normal ». Il correspond à l’ordre dans lequel les
boîtes apparaissent dans le texte, qui est aussi celui de leurs balises dans le code
HTML. C’est le cas pour tous les documents HTML, qu’ils soient écrits manuellement ou générés automatiquement.
L’ordre du flux courant intervient dans l’affichage par défaut, sans styles, sans mise
en page ni positionnement particulier, mais certaines propriétés CSS permettent de
« sortir » des éléments du flux courant pour les positionner de façon personnalisée.
Dans le flux courant, deux paragraphes (balises de type bloc) s’afficheront par défaut
l’un sous l’autre. Adopter un positionnement absolu ou flottant permettra d’extraire
l’un d’eux du flux (disons, le second) pour l’afficher ailleurs, par exemple à côté du
premier.

Quel joli titre évocateur

Un petit texte en rapport avec le titre principal

Un sous-titre intéressant

Un second paragraphe avec des mots importants.