How to display Italic Text using CSS?

CSS Italic Text

To display italic text using CSS, set font-style property for the HTML Element(s) with italic value.

font-style: italic;

Examples

Italic Paragraph

In the following example, we set the font-style of a paragraph to italic to display italic text.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
        #p1 {
            font-size: 25px;
            font-style: italic;
        }
    </style>
</head>
<body>
    <p id="p1">This is a paragraph.</p>
</body>
</html>

Italic Heading

In the following example, we set the font-style of a heading <h2> to italic to display italic text.

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <style>
        #e1 {
            font-style: italic;
        }
    </style>
</head>
<body>
    <h2 id="e1">Hello World</h2>
</body>
</html>

Conclusion

In this CSS Tutorial, we learned how to display italic text using CSS font-style property, with examples.