Skip to content
Related Articles

Related Articles

HTML | DOM Style color Property
  • Last Updated : 04 Sep, 2019

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 represent a text-color of an element.

Example:




<!DOCTYPE html>
<html>
  
<head>
    <title>DOM Style color Porperty</title>
</head>
  
<body style="text-align:center">
  
    <h1 id="geeks1">GeeksforGeeks</h1>
    <h2 id="geeks2">DOM Style color Porperty</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:



Example: 2




<!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

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :