How to italicize text in CSS ?

Last Updated : 23 Jul, 2025

Here are the approaches to italicize text in CSS:

Using the font-style Property

The CSS font-style property is the most straightforward way to italicize text.

HTML 
<html>
<head>
    <style>
        .italic-text {
            font-style: italic;
        }
    </style>
</head>
<body>
    <p class="italic-text">This text will be italicized using CSS.</p>
</body>
</html>
  • The .italic-text class applies the font-style: italic; property to the paragraph, rendering its content in italics.


Using the <i> or <em> HTML Tags

These HTML tags are semantically used to italicize text.

HTML 
<html>
<body>
    <p>This text uses the 
       <i><i> tag</i> to italicize.
    </p>
    <p>This text uses the 
      <em><em> tag</em> to emphasize and italicize.
    </p>
</body>
</html>
  • The <i> tag is used to italicize text without adding semantic emphasis.
  • The <em> tag is used to emphasize text, which typically renders as italic and conveys semantic importance.
Comment

Explore