Definition and Usage
The border-top-color CSS property sets the color of the top border of an element. Note that in many cases the shorthand CSS properties border-color or border-top are more convenient and preferable.
- Initial currentColor
- Applies to all elements
- Inherited no
- Media visual
- Computed Value If the value is translucent, the computed value will be the rgba() corresponding one. If it isn't, it will be the rgb() corresponding one. The transparent keyword maps to rgb(0,0,0).
-
Animatable yes, as a color
- Canonical order the unique non-ambiguous order defined by the formal grammar
Syntax
Formal syntax: <color>
border-top-color: red
border-top-color: rgb(255, 128, 0)
border-top-color: hsla(100%, 50%, 25%, 0.75)
border-top-color: #ffbb00
border-top-color: currentColor
border-top-color: transparent
border-top-color: inherit
Values
- <color>
-
Is a <color> CSS value describing the color of the top border.
- inherit
- Is a keyword denoting the color of the top border of the parent's element (which may be different from the border-top-color default value)
Examples
pre {
border: solid 0.3em gold;
border-top-color: red;
}
/* this has the same result:
pre {
border: solid 0.3em;
border-color: red gold gold;
} */
Compatibility
Desktop browsers
Feature |
Chrome |
Firefox (Gecko) |
Internet Explorer |
Opera |
Safari (WebKit) |
Basic support |
1.0 |
1.0 (1.7 or earlier) |
4 |
3.5 |
1.0 (85) |
Mobile browsers
Feature |
Android |
Firefox Mobile (Gecko) |
IE Phone |
Opera Mobile |
Safari Mobile |
Basic support |
1.0 |
1.0 (1.0) |
(Yes) |
(Yes) |
(Yes) |