Javascript Reference - HTML DOM Style borderLeftColor Property

The borderLeftColor property sets or gets the color of the left border.

Browser Support


`borderLeftColor`	Yes	Yes	Yes	Yes	Yes

Syntax

Return the borderLeftColor property:

var v = object.style.borderLeftColor

Set the borderLeftColor property:

object.style.borderLeftColor=color|transparent|initial|inherit

Property Values

Value	Description
color	Set the color of the left border. Default color is black
transparent	Set color of the left border to transparent
initial	Sets to default value.
inherit	Inherits from parent element.

Technical Details

Default Value:	black
Return Value:	A string representing the color of left border
CSS Version	CSS1

Example

The following code shows how to change the color of the left border.


<!DOCTYPE html>
<html>
<head>
<style>
#myDiv {<!--  ww w  .  j  a v a 2 s.  co m-->
    border: thick solid blue;
}
</style>
</head>
<body>
<div id="myDiv">This is a div element.</div>
<button type="button" onclick="myFunction()">test</button>
<script>
function myFunction() {
    document.getElementById("myDiv").style.borderLeftColor = "black";
}
</script>
</body>
</html>

The code above is rendered as follows:

Example 2

The following code shows how to get the left border color.


<!DOCTYPE html>
<html>
<body>
<div id="myDiv" style="border-left:thick solid green">div</div>
<button type="button" onclick="myFunction()">test</button>
<script>
function myFunction() {<!--   w  w  w .j  a v  a 2  s.c o m-->
    console.log(document.getElementById("myDiv").style.borderLeftColor);
}
</script>
</body>
</html>

The code above is rendered as follows: