On utilise en CSS principalement trois propriétés des bordures : l’épaisseur, le style et la couleur.
Pour le style, c’est à dire la façon dont la bordure est dessinée, on utilise la propriété "border-style". Cette propriété peut prendre plusieurs valeurs dont celles ci-dessous :
none: aucune bordure
dashed: en tirets
dotted: en pointillés solid: un seul trait plein double: deux traits pleinsgroove: bordure en creuxridge: bordure en saillieinset: bordure en relief vers l'arrière ouset: en relief vers l'avantPour l’épaisseur, on utilise la propriété border-width qui peut prendre des valeurs en pixels, mais que l’on peut aussi définir à l’aide de mots-clés comme :
thin: bordure mince
medium: bordure moyenne thick: bordure épaisse La couleur des bordures est définie par la propriété border-color. Celle-ci peut prendre des valeurs de mots-clés (red, blue, black, orange...) ou des valeurs de couleurs hexadécimales #FF3300, #000000, etc....
table {border-color: red }
ou encore border-color: #FF0000
Regroupement des propriétés
On peut regrouper les propriétés épaisseur, style, et couleur d’une bordure en une seule commande. Elles doivent êtres définies dans l’ordre précité. Ces propriétés regroupées peuvent être alors définies pour chaque côté.
Exemple :
div {
border-top: 7 solid #FFCF00;
border-right: thin double #808080;
}Maintenant que vous avez vu comment traiter les bordures, passons sans plus tarder au positionnement des boîtes.
28 décembre 2004
Mise en page : Le positionnement flottant avec les CSS
CSS : Une mise en page sur 2 colonnes avec la propriété float
Construire un menu avec les CSS
Le recouvrement de blocs
Positionner des blocs en absolu en CSS
Le positionnement relatif en CSS
Le positionnement des blocs en CSS : Le flux normal
Mise en page en CSS : les types de boîtes
Mise en page avec les CSS : Comprendre le modèle de boîte
Les pseudo-classes