HTML - DOM Style Object letterSpacing Property

Quiz

HTML DOM Style Object letterSpacing property sets or returns the space between characters of text.

Syntax

Set the letterSpacing property:

object.style.letterSpacing= "normal | length | initial | inherit";

Get the letterSpacing property:

object.style.letterSpacing;

Property Values

Value	Description
normal	It is the default value which sets the normal spacing between characters.
length	It specifies the space between characters in length units. It also accepts negative values.
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 space between characters.

Example of HTML DOM Style Object 'letterSpacing' Property

The following example sets space between the characters.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM Style Object letterSpacing Property
    </title>
</head>
<body>
    <p>
        Click to set letterSpacing property values.
    </p>
    <button onclick="fun()">
        Space 10px
    </button>
    <button onclick="funTwo()">
        Normal Spacing
    </button>    
    <br>
    <p id="space">
        Welcome to Tutorials Point.
    </p>
    <script>
        function fun() {
            document.getElementById("space")
                .style.letterSpacing = "10px";
        }
        function funTwo() {
            document.getElementById("space")
                .style.letterSpacing = "normal";
        }        
    </script>
</body>
</html>

Supported Browsers

Property
letterSpacing	Yes 1	Yes 12	Yes 1	Yes 1	Yes 3.5

html_dom.htm

Print Page