Manuales 
border-color 4c3c4o
The border-color property is used to set the color of the borders of an element. c532z
It is a shorthand property for the border-left-color properties.
The value of the border-color property can be specified using one, two, three, or four components.
When one value is used, the value specifies the color of the top, right, bottom, and left borders. If two values are used, the first value specifies the color of the top and bottom borders and the second value specifies the color of the right and left borders. If three values are used, the first one specifies the color of the top border, the second one specifies the color of the right and left borders, and the third one specifies the color of the bottom border. If four values are used, the first, second, third, and fourth values specify the color of the top, right, bottom, and left borders respectively.
Official Syntax 3xs5l
- Syntax:
border-color: <color>
- Initial: The concatenation of the long-hand properties:
border-top-color: currentColorborder-right-color: currentColorborder-bottom-color: currentColorborder-left-color: currentColor
- Applies To: all elements
- Animatable: yes, the long-hand properties are animatable as
<color>s
Values u704t
- <color>
-
See the
<color>entry for a list of possible values.
Notes 441w3q
The border-color property can also inherit the value of the element’s parent’s border color using the keyword inherit.
Examples 2h2053
The following are all valid border-color values set on an element. The element’s border style and border width are also set using the border-width respectively.
.element {
border-style: dotted;
border-width: 1em;
border-color: red; /* one-value syntax */
/* or */
border-color: red green; /* two-value syntax */
/* or */
border-color: red pink green; /* three-value syntax */
/* or */
border-color: red pink yellow green; /* four-value syntax */
}
Browser 572e63
The property works in all major browsers: Chrome, Firefox, Safari, Opera, IE, and on Android and iOS.