Manuales 
border-color 6q5h3j
The border-color property is used to set the color of the borders of an element. 55325u
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 2f2j3w
- 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 445h6m
- <color>
-
See the
<color>entry for a list of possible values.
Notes 6p2z1x
The border-color property can also inherit the value of the element’s parent’s border color using the keyword inherit.
Examples 5w70f
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 51c73
The property works in all major browsers: Chrome, Firefox, Safari, Opera, IE, and on Android and iOS.