CSS font-style property

The CSS font-style property is used to specify the style of the font for text content. It allows you to control whether the text should be displayed in a normal, italic, or oblique style. The font-style property accepts three possible values:

1. normal: This is the default value, and it displays the text in a normal style (i.e., upright).
2. italic: It displays the text in an italic style. Italic fonts have a slight slant to the right, giving the text a more stylized appearance.
3. oblique: It displays the text in an oblique style. Oblique fonts are similar to italic fonts, but they are generated by simply slanting the regular font horizontally, so the appearance might not be as refined as true italics.

Here’s an example of how to use the font-style property in CSS:

/* Normal font style */
.normal-text {
  font-style: normal;
}

/* Italic font style */
.italic-text {
  font-style: italic;
}

/* Oblique font style */
.oblique-text {
  font-style: oblique;
}

In the example above, we define three CSS classes: .normal-text, .italic-text, and .oblique-text. By applying these classes to different elements, you can control the font style of the text accordingly.

It’s important to note that the font-style property might not work as expected if the specific font-family being used does not have an associated italic or oblique style. In such cases, the browser may apply a default style, or the font may not change at all. If you want to ensure that the text is displayed in a specific style, make sure to choose a font that supports the desired style, or use web-safe fonts that have built-in italic or oblique variants.