Propriété Style borderColor

Définition et utilisation

borderColor Cette propriété configure ou retourne la couleur de la bordure de l'élément.

Cette propriété peut accepter une à quatre valeurs :

  • Une valeur, par exemple : p {border-color: red} - tous les quatre bords sont rouges
  • Deux valeurs, par exemple : p {border-color: red transparent} - Les bordures supérieure et inférieure sont rouges, les bordures latérales sont transparentes
  • Trois valeurs, par exemple : p {border-color: red green blue}- La bordure supérieure est rouge, les bordures latérales sont vertes, la bordure inférieure est bleue
  • Quatre valeurs, par exemple : p {border-color: red green blue yellow} - La bordure supérieure est rouge, la bordure droite est verte, la bordure inférieure est bleue, la bordure gauche est jaune

Voir également :

Tutoriel CSS :Bordure CSS

Manuel de référence CSS :Propriété border-color

Manuel de référence HTML DOM :Propriété border

Exemple

Exemple 1

Changez la couleur de la bordure des quatre côtés de l'élément <div> en rouge :

document.getElementById("myDiv").style.borderColor = "red";

Essayez-le vous-même

Exemple 2

Changez la couleur de la bordure supérieure et inférieure de l'élément <div> en vert, et la couleur de la bordure latérale en pourpre :

document.getElementById("myDiv").style.borderColor = "green purple";

Essayez-le vous-même

Exemple 3

Retourne la couleur de bordure de l'élément <div> :

alert(document.getElementById("myDiv").style.borderColor);

Essayez-le vous-même

Syntaxe

Retourne la propriété borderColor :

object.style.borderColor

Définir la propriété borderColor :

object.style.borderColor = "color|transparent|initial|inherit"

Valeur de l'attribut

Valeur Description
color

Définit la couleur de la bordure. La couleur par défaut est noire.

Voir Valeur de couleur CSS, pour obtenir la liste complète des valeurs de couleur possibles.
transparent La couleur de la bordure est transparente (le contenu sous-jacent est visible).
initial Définit cette propriété à sa valeur par défaut. Voir initial.
inherit Inherits this property from its parent element. Voir inherit.

Détails techniques

Valeur par défaut : noir
Valeur de retour : Chaîne, représentant la couleur de la bordure de l'élément.
Version de CSS : CSS1

Prise en charge du navigateur

Les nombres dans le tableau indiquent la version du navigateur qui prend en charge cette propriété pour la première fois.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 3.5