border-color
La propriété border-color est une propriété raccourcie qui permet de définir la couleur de la bordure sur les quatre côtés de la boîte de bordure d'un élément. Elle permet de définir border-top-color, border-right-color, border-bottom-color et border-left-color.Cette propriété accepte 1, 2, 3 ou 4 valeurs du type <color>.
<!-- Style commun aux exemples qui suivent -->
<style>
.ex {
width: 300px;
height: 120px;
background-color: palegreen;
border-width: 6px;
border-style: solid;
}
</style>
- Une valeur Les quatre côtés de la bordure seront de la même couleur.
border-color: blueviolet;
- Deux valeurs La première couleur sera pour les lignes horizontales, la deuxième pour les lignes verticales.
border-color: #ffff00 darkred;
- Trois valeurs La première couleur sera pour la ligne du haut, la deuxième pour les lignes verticales et la troisième pour la ligne du bas.
border-color: #00ff00 currentcolor rgb(255, 0, 255);
- Quatre valeurs La première couleur sera pour la ligne du haut, la deuxième pour la ligne de droite la troisième pour la ligne du bas et la quatrième pour la ligne de gauche.
border-color: #ff00ff #bcd red yellow;