Retourner à l'illustration du modèle de boîte CSS 1

Description longue de l'illustration du modèle de boîte CSS 1

Cette illustration montre les quatre aires d'une boîte générique en CSS : le contenu, l'espacement interne, la bordure et les marges. Il y a quatre boîtes imbriquées: l'aire du contenu est celle la plus interne, puis viennent l'aire de l'espacement interne, l'aire de la bordure et finalement l'aire de la marge qui est la plus externe.

Tout le modèle de boîte CSS est une mise en forme simple bâtie sur un concept de boîtes dans lequel chaque élément formaté s'inscrit dans une ou plusieurs boîtes rectangulaires. Toutes les boîtes sont formées d'une aire avec un contenu de base entourée d'un espacement interne optionnel, d'une bordure et d'aires de marge.

La taille de la boîte est égale à la largeur CSS de l'élément (c.-à-d. celle d'un texte formaté ou d'une image) et de l'espacement interne auquel on ajoute la bordure et les marges.

Retourner à l'illustration du modèle de boîte CSS 1