HTML - DOM Style Object fontStyle Property

Quiz

HTML DOM Style Object fontStyle property sets or returns the font style of an element.

Syntax

Set the fontStyle property

object.style.fontStyle= "normal | italic | oblique | initial | inherit";

Get the fontStyle property

object.style.fontStyle;

Property Values

Value	Description
normal	It is the default value which represents normal font of the element.
italic	It represents italic font.
oblique	It represents oblique font.
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 font style property of element.

Example of HTML DOM Style Object 'fontStyle' Property

The following example implements italic, normal and oblique values of font style property.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM Style Object fontStyle Property
    </title>
</head>
<body>
    <p>Click to change font style.</p>
    <button onclick="italic()">Italic</button>
    <button onclick="normal()">Normal</button>
    <button onclick="oblique()">Oblique</button>
    <p id="font">Welcome to Tutorials Point.</p>    
    <script>
        function italic() {
            document.getElementById("font")
                .style.fontStyle= "italic";
        }
        function normal() {
            document.getElementById("font")
                .style.fontStyle= "normal";
        }
        function oblique() {
            document.getElementById("font")
                .style.fontStyle= "oblique";
        }
    </script>
</body>
</html>

Supported Browsers

Property
fontStyle	Yes 1	Yes 12	Yes 1	Yes 1	Yes 7

html_dom.htm

Print Page