Javascript DOM CSS Style borderTopColor Property

Introduction

Change the color of the top border of a <div> element to red:

document.getElementById("myDiv").style.borderTopColor = "red";

View in separate window

<!DOCTYPE html>
<html>
<head>
<style>
#myDiv {//from   www  .  j  a  v a2 s.c o m
  border: thick solid blue;
}
</style>
</head>
<body>

<div id="myDiv">This is a div.</div>
<br>
<button type="button" onclick="myFunction()">Change color of the top border</button>

<script>
function myFunction() {
  document.getElementById("myDiv").style.borderTopColor = "red";
}
</script>

</body>
</html>

The borderTopColor property sets or gets the color of the top border of an element.

Property Values

Value	Description
color	Specifies the color of the top border. `Default` color is black
transparent	The color of the top border is transparent
initial	Sets this property to its default value.
inherit	Inherits this property from its parent element.

The borderTopColor property returns a String representing the color of an element's top border.

Previous Next