Login

Bienvenue sur le site de Jef

Les bases du CSS

Initiation aux boites conteneurs

Les boîtes ou conteneurs

Les éléments de la page html seront considérés comme des boîtes rectangulaires.
Chaque boîte possède une aire de contenu (ex. une texte, une image, etc.) entourée en option par une aire d'espacement, une aire de bordure et une aire de marge.
Le shéma suivant indique la terminologie employée.

Pour construire une boîte, on utilise une balise du html (p, div, span, h1 à h6, ul, li, td, etc.) à laquelle on applique un style.
Mais toutes les balises précitées n'offrent pas les mêmes possibilités que nous verrons aux cas par cas.

Pour cela nous allons utiliser:
margin:
border:
padding:

syntaxe

Les valeurs de margin, border et padding sont exprimées en pixel (px), em ou %.
Par exemple, pour avoir une marge extérieure de 20 pixels et un espacement intérieur de 10% de la hauteur, il faudra coder:
{ margin:20px; padding-top:10%; }