HTML DOM Heading align Property

Last Updated : 30 Aug, 2022

The HTML DOM Heading align property is used to set or return the horizontal alignment of the <h1>to <h6> element.

Note: This property is not supported by HTML5.

Syntax:

It is used to return the align property.

HeadingObject.align;

It is used to set the align property.

HeadingObject.align="left | right | center | justify";

Property Values:

left: It sets the text left-aligned. It is the default value.
right: It sets the text right-aligned.
center: It sets the text center-aligned.
justify: It stretches the text of the paragraph to set the width of all lines equal.

Example: Below HTML code returns and sets the Heading to align property.

HTML

<!DOCTYPE html>
<html>
<body>
    <center>
        <h1 style="color:green;">
            GeeksforGeeks
        </h1>
        <h2> DOM Headings align property </h2>
        <h3 id="headingID" align="left">
            A computer science portal for Geeks
        </h3>
        <button onclick="get()">
            return Alignment
        </button>
        <button onclick="set()">
            Set Alignment
        </button>
        <p id="paraID"></p>
 
        <script>
            function get() {
 
                // Return Heading align Property
                var g = document.getElementById(
                    "headingID").align;
 
                document.getElementById(
                    "paraID").innerHTML = g;
            }
 
            function set() {
 
                // Set the Heading align Property
                var k = document.getElementById(
                    "headingID").align = "right";
 
                document.getElementById(
                    "paraID").innerHTML = k;
            }
        </script>
    </center>
</body>
</html>