outlineColor Property - Javascript CSS Style Property

Javascript examples for CSS Style Property:outlineColor

  1. HOME
  2. Javascript
  3. CSS Style Property
  4. outlineColor

Description

The outlineColor property sets or gets the color of the outline around an element.

Property Values

Value Description
color color of the outline.
invert Inverts the color of the outline to the opposite value. Default value.
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Technical Details

Item Value
Default Value: invert
Return Value: A String, representing the color of an element's outline
CSS VersionCSS2

Change the color of the outline of a <div> element:

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
#myDiv {/*from w w  w. j  a v  a2 s.  c om*/
    border: 1px solid red;
    outline-style: dotted;
}
</style>
</head>
<body>

<div id="myDiv" style="outline-color:blue;">This is a div element.</div>
<br>
<button type="button" onclick="myFunction()">Test</button>

<script>
function myFunction() {
    document.getElementById("myDiv").style.outlineColor = 'blue';
}
</script>

</body>
</html>

Related Tutorials