Skip to content
Related Articles

Related Articles

Improve Article
HTML | DOM HR align Property
  • Last Updated : 05 Sep, 2019

The HTML DOM HR align property is used to set or return the value of the align attribute of <hr> element.

Syntax:

  • It returns the HR align property.
    hrobject.align;
  • It sets the HR align property.
    hrobject.align="left | right | center"

Property Values:

  • left: It sets the left-align to horizontal line.
  • center: It sets the center-align to horizontal line. It is the default value.
  • right: It sets the right-align to horizontal line.

Return Values: It returns a string value which represents the alignment of the HR element.

Example 1: This example sets the HR align property.






<!DOCTYPE html>
<html>
  
<head>
    <title>HTML DOM hr align property</title>
</head>
  
<body>
    <H1>GeeksForGeeks</H1>
    <h2>DOM HR align Property</h2>
    <p>There is a horizontal rule below this paragraph.</p>
  
    <!-- Assigning id to 'hr' tag. -->
    <hr id="GFG" 
        align="left" 
        width="140px">
  
    <p>This is a horizontal rule above this paragraph.</p>
    <button onclick="myGeeks()">Try it</button>
  
    <script>
        function myGeeks() {
  
            // Accessing 'hr' tag. 
            var x = 
                document.getElementById("GFG").align = 
                "center";
        }
    </script>
</body>
  
</html>

Output:

  • Before Clicking on Button:
  • After Clicking on Button:

Example 2: This example returns the HR align property.




<!DOCTYPE html>
<html>
  
<head>
    <title>HTML DOM hr align property</title>
</head>
  
<body>
    <H1>GeeksForGeeks</H1>
    <h2>DOM HR align Property</h2>
    <p>There is a horizontal rule below this paragraph.</p>
  
    <!-- Assigning id to 'hr' tag. -->
    <hr id="GFG" align="left" width="140px">
  
    <p>This is a horizontal rule above this paragraph.</p>
    <button onclick="myGeeks()">Try it</button>
    <h3 id="sudo"></h3>
    <script>
        function myGeeks() {
  
            // Accessing 'hr' tag. 
            var x = document.getElementById("GFG").align;
            document.getElementById("sudo").innerHTML = x;
        }
    </script>
</body>
  
</html>

Output:

  • Before Clicking on Button:
  • After Clicking on Button:

Supported Browsers: The browsers supported by DOM HR align Property are listed below:

  • Google Chrome
  • Internet Explorer
  • Firefox
  • Apple Safari
  • Opera



My Personal Notes arrow_drop_up
Recommended Articles
Page :