CSS - Propriété border-width
Description de la propriété border-width
.
border-width
définit l'épaisseur des bordures d'un élément.
C'est une propriété raccourcie en ce sens qu'elle définit en une seule écriture l'épaisseur des
quatre bordures.
Il existe également des propriété spécifiques pour chacune des bordures:
border-top-width
,
border-right-width
,
border-bottom-width
et
border-left-width
.
Pour que les bordures soit visibles, pensez aussi à définir la propriété
border-style
.
Certains styles de trait (double, effets de relief) nécessitent une épaisseur
minimale de 2 ou 3 pixels pour être correctement rendus.
Syntaxes pour border-width
.
border-width: a b c d;
Ceci est la syntaxe générale de
border-width
: de une à quatre valeurs séparées par des espaces. Les règles d'attribution sont les suivantes, en fonction du nombre de valeurs fournies :
Une seule valeur
Deux valeurs
Trois valeurs
Quatre valeursborder-width: 5px;
De une à quatre valeurs numériques, positives ou nulles, suivies de leur unité de dimension (voir les unités de dimensions en CSS).
border-width: medium;
Valeur par défaut. Épaisseur moyenne (en général de l'ordre de 3 pixels).
border-width: thin;
Épaisseur fine (en général de l'ordre de 1 pixel).
border-width: thick;
Épaisseur large (en général de l'ordre de 5 pixels).
-
Reportez-vous à la description générale de ces valeurs.
Exemple.
Effet particulier obtenu avec une bordure d'épaisseur différente pour le haut
Simulateur.
border-width
:
Voir aussi...
Bordures - Propriétés.
border
: Résumé des propriétés des bordures.border-collapse
: Mode d'encadrement des cellules de tableau.border-color
: Définit la couleur des bordures.border-image
: Résumé des propriétés des bordures réalisées avec des images.border-image-outset
: Débordement de l'image de bordure.border-image-repeat
: Mode de répétition de l'image de bordure.border-image-slice
: Définit comment l'image de bordure est découpée.border-image-source
: L'image utilisée pour construire la bordure.border-image-width
: La largeur de la bordure image.border-radius
: Rayon des angles arrondis.border-spacing
: Espacement entre les cellules adjacentes dans un tableau.border-style
: Type de bordure (simple, double, pointillé...).