HTML | DOM Style outlineColor Property
The DOM Style outlineColor Property is used to sets or returns the color of the outline around an Element.
Syntax:
object.style.outlineColor
object.style.outlineColor = "color|invert|initial|inherit"
Property Values:
- color: It sets the outline color to any valid CSS color.
- invert: It set the outline color to a color which is inverse of the background, which ensures the outline will always be visible. Note: It is not supported by all browsers.
- Inherit: It sets the outline color according to outline-color property inherited from its parent element.
Return Value: It returns a string value which represent the color of the ouline in an element’s.
Example-1:
<!DOCTYPE html> < html > < head > < title > HTML | DOM Style outlineColor Property </ title > < style > #myDiv { border: 1px solid red; outline: green dotted thick; } </ style > </ head > < body > < h1 > Geeks for Geeks</ h1 > < h2 >HTML | DOM Style outlineColor Property</ h2 > < div id = "myDiv" >Welcome to Geeks for Geeks.</ div > < br > < button type = "button" onclick = "myFunction()" > Click Here! </ button > < script > function myFunction() { // Set outline color. document.getElementById("myDiv") .style.outlineColor = "red"; } </ script > </ body > </ html > |
chevron_right
filter_none
Output:
Before Clicking On Button:
After Clicking On Button:
Example-2 :
<!DOCTYPE html> < html > < head > < title > HTML | DOM Style outlineColor Property </ title > < style > #myDiv { border: 1px solid red; outline: dotted thick; } </ style > </ head > < body > < h1 > Geeks for Geeks</ h1 > < h2 >HTML | DOM Style outlineColor Property</ h2 > < div id = "myDiv" style = "outline-color:green;" > Welcome to Geeks for Geeks.</ div > < br > < button type = "button" onclick = "myFunction()" > Click Here! </ button > < script > function myFunction() { alert(document.getElementById( "myDiv").style.outlineColor); } </ script > </ body > </ html > |
chevron_right
filter_none
Output:
- Before clicking On Button:
- After Clicking On Button:
Supported Browsers: The browser supported by DOM Style outlineColor Property are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Safari