HTML | DOM Style color Property
The DOM style color property is used to set or return the color of the text.
Syntax:
- It is used to set the color property.
object.style.color
- It is used to return the color property.
object.style.color = "color|initial|inherit"
Property Values:
Return Value: It returns a string value which represents a text-color of an element.
Example:
html
<!DOCTYPE html><html><head> <title>DOM Style color Property</title></head><body style="text-align:center"> <h1 id="geeks1">GeeksforGeeks</h1> <h2 id="geeks2">DOM Style color Property</h2> <p id="geeks3"> GeeksforGeeks: A computer science portal </p> <button type="button" onclick="geeks()"> Submit </button> <script> function geeks() { document.getElementById("geeks1").style.color = "green"; document.getElementById("geeks2").style.color = "black"; document.getElementById("geeks3").style.color = "blue"; } </script></body></html> |
Output:
Before click on the button:
After click on the button:
Example: 2
html
<!DOCTYPE html><html> <head> <title>DOM Style color Property</title> </head> <body style = "text-align:center"> <h1 style = "color:green;" id = "gfg"> GeeksforGeeks </h1> <h2>DOM Style color Property</h2> <button type = "button" onclick = "geeks()"> Submit </button> <script> function geeks() { alert(document.getElementById("gfg").style.color); } </script> </body></html> |
Output:
Supported Browsers: The browser supported by DOM Style color property are listed below:
- Google Chrome
- Internet Explorer
- Firefox
- Opera
- Apple Safari
Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML course.
