border-bottom-width

La propriété border-bottom-width définit l'épaisseur de la bordure pour le côté bas d'une boîte.

Syntaxe

/* Une valeur de longueur */
/* Type <length>          */
border-bottom-width: 10em;
border-bottom-width: 3vmax;
border-bottom-width: 6px;

/* Valeurs avec un mot-clé */
border-bottom-width: thin;
border-bottom-width: medium;
border-bottom-width: thick;

border-bottom-width: inherit;

Valeurs

<br-width>

Une valeur de longueur (<length>) positive ou un mot-clé qui indique l'épaisseur de la bordure pour le bas de la boîte. Si la valeur est un mot-clé, ce doit être l'une des valeurs suivantes :

thin		Une bordure fine.
medium		Une bordure moyenne.
thick		Une bordure épaisse.

La spécification ne précise pas de façon exacte l'épaisseur correspondant à chacun de ces mots-clés (c'est donc à chaque implémentation de choisir). La spécification requiert toutefois que l'inégalité suivante soit respectée thin ≤ medium ≤ thick et que ces valeurs soient constantes pour un même document.

inherit

Ce mot-clé représente la valeur calculée de border-bottom-width de l'élément parent.

Syntaxe formelle

<br-width>
où 
<br-width> = <length> | thin | medium | thick

Exemples

CSS

.element1{
  border-bottom: thick solid red;
}
.element2{
  border-bottom: medium solid orange;
}
.element3{
  border-bottom: thin solid green;
}

HTML

<p class="element1">
  Une bordure épaisse rouge.
</p>

<p class="element2">
  Une bordure moyenne orange.
</p>

<p class="element3">
  Et une bordure fine verte.
</p>

Résultat

Spécifications

Compatibilité des navigateurs

Voir aussi

• Les autres propriétés liées à la largeur de la bordure :
  • border-left-width,
  • border-right-width,
  • border-top-width,
  • border-width
• Les autres propriétés CSS liées à la bordure du côté haut :
  • border,
  • border-bottom,
  • border-bottom-style,
  • border-bottom-color.