CSS Reference
Property
border-bottom-color
The border-bottom-color property is used to set the color of the bottom border of an element.
Official Syntax
-
Syntax:
border-bottom-color: <color>
- Initial: currentColor
- Applies To: all elements
-
Animatable: yes, as a
<color>
Values
- <color>
-
See the
<color>property entry for a list of possible values.
Notes
The border-bottom-color property can also inherit the value of the element’s parent’s bottom border color using the keyword inherit.
Examples
The following are all valid border-bottom-color values set on an element. The element’s border style and border width are also set using the border-bottom-style and border-bottom-width respectively.
.element {
border-bottom-style: dotted;
border-bottom-width: 10px;
border-bottom-color: red;
/* or */
border-bottom-color: #44aacf;
/* or */
border-bottom-color: rgba(255,0,10,.5);
}
Live Demo
See the live demo in action and play with the values:
View this demo on the Codrops PlaygroundBrowser Support
The property works in all major browsers: Chrome, Firefox, Safari, Opera, IE, and on Android and iOS.