font-style

by

The font-style property in CSS controls the italicization of text. It has three possible values:

  • normal: Default value. Text is displayed in an upright, non-italic style.
  • italic: Text is displayed in italics.
  • oblique: Similar to italic, but uses an oblique font variant if available. If not, it simulates italics.

Basic Usage

To apply font-style to an element, you simply use the property name followed by a colon and the desired value:

p {
  font-style: italic;
}

This will make all text within <p> elements italicized.

Example

<!DOCTYPE html>
<html>
<head>
  <style>
    p {
      font-style: italic;
    }
  </style>
</head>
<body>
  <p>This text is italicized.</p>
  <p>This text is normal.</p>
</body>
</html>

Additional Notes

  • You can combine font-style with other font properties like font-weight and font-family for more complex typography.
  • The font shorthand property can also be used to set font-style along with other font properties.

Example with font shorthand

p {
  font: italic 16px Arial, sans-serif;
}

This sets the font style to italic, the font size to 16px, and the font family to Arial (or a sans-serif font if Arial is not available).