HTML - DOM Style Object direction Property

Quiz

HTML DOM Style Object direction property is used to set or get the text direction of an element.

Syntax

Set the direction property:

object.style.direction= "ltr | rtl | initial | inherit";

Get the direction property:

object.style.direction;

Property Values

Value	Description
ltr	It is the default value which specifies text direction form left to right.
rtl	It specifies text direction form right to left.
initial	It is used to set this property to it's default value.
inherit	It is used to inherit the property of it's parent element.

Return Value

It returns a string value which represents text direction of an element.

Example of HTML DOM Style Object 'direction' Property

The following example changes the direction from left-to-right to right-to-left.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM Style Object direction Property
    </title>
</head>
<body>
    <button onclick="fun()">RTL</button>
    <button onclick="funTwo()">LTR</button>
    <p id="direction">Welcome to Tutorials Point</p>
    <script>
        function fun() {
            document.getElementById("direction")
                .style.direction = "rtl";
        }
        function funTwo() {
            document.getElementById("direction")
                .style.direction = "ltr";
        }
    </script>
</body>
</html>

Supported Browsers

Property
direction	Yes 2	Yes 12	Yes 1	Yes 1	Yes 9.2

html_dom.htm

Print Page