# HTML DOM Style borderBottomColor Property
## Definition and Usage
The borderBottomColor property sets or returns the color of an element's bottom border.
## Browser Support
| Property | | | | | |
| borderBottomColor | Yes | Yes | Yes | Yes | Yes |
**Note:** Internet Explorer 7 and earlier versions do not support the borderBottomColor property. IE8 only supports - if a !DOCTYPE is specified!
## Syntax
Return the borderBottomColor property:
```
object.style.borderBottomColor
```
Set the borderBottomColor property:
```
object.style.borderBottomColor = "color|transparent|initial|inherit"
```
## Property Values
| Value | Description |
| :--- | :--- |
| color | Specifies the color of the bottom border. Look at ( for a complete list of possible color values. |
| transparent | The border color is transparent (the underlying page will show through). Default value |
| initial | Sets this property to its default value. Read about ( |
| inherit | Inherits this property from its parent element. Read about ( |
## Technical Details
| Default value: | Not specified |
| :--- | :--- |
| Return value: | A string, representing the color of an element's bottom border |
| CSS version | CSS1 |
## More Examples
### Example
A demonstration of how to set the bottom border color:
```
borderdemo
{
border: 1px solid red;
}
Original text
function myFunction()
{
document.getElementById("demo").style.borderBottomColor = "blue";
}
```
### Example
How to set the bottom border to transparent:
```
Click the button to make the bottom border transparent.
function myFunction()
{
document.getElementsByTagName("div").style.borderBottomColor = "transparent";
}
```
### Example
How to set the bottom border to inherit from parent element:
```
Click the button to make the bottom border color inherit from the parent element.
function myFunction()
{
document.getElementsByTagName("div").style.borderBottomColor = "inherit";
}
```
## Related Pages
CSS tutorial: (
CSS reference: ( property
YouTip