6.1 Modèle de boîte CSS

Comment sont faits les rectangles

Par défaut, chaque élément HTML est rendu dans le navigateur sous forme de rectangle. Les dimensions de ce rectangle sont dynamiques : elles varient en fonction du contenu de cet élément. Vous pouvez considérer ces rectangles comme étant fluides, en modifiant leur forme pour les adapter au contenu.
En effet, une page Web est un élément vivant : il suffit de redimensionner la fenêtre de votre navigateur pour voir comment la plupart des éléments s’adapteront automatiquement à l’espace disponible.
C’est le comportement par défaut d’une page Web. Mais parce que la conception d’une page Web nécessite souvent de fixer des éléments en place, avec des dimensions spécifiques, CSS nous permet de modifier, voire d’annuler ce comportement fluide.
Un élément de niveau bloc, comme un paragraphe, occupera horizontalement tout l’espace possible, qui correspond par défaut à la largeur de votre navigateur. Verticalement, le paragraphe adaptera sa hauteur à la longueur de son contenu.
De nombreux paramètres sont pris en compte: la longueur du contenu, la police utilisée, sa taille, son espacement, le remplissage de l’élément, les bordures, s’il est flottant, son positionnement…
Article précédent5.6 Propriétés du texte CSS
Article suivant6.2 Fond CSS