Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Selected Reading
Usage of font-style property in CSS
The font-style property in CSS is used to specify whether text should be displayed in normal, italic, or oblique style. This property allows you to add emphasis to text by changing its visual appearance.
Syntax
font-style: normal | italic | oblique;
Values
- normal - Default value. Text is displayed normally
- italic - Text is displayed in italic style (slanted)
- oblique - Text is displayed in oblique style (artificially slanted)
Example: Basic Font Style Usage
<html>
<head>
<style>
.normal-text { font-style: normal; }
.italic-text { font-style: italic; }
.oblique-text { font-style: oblique; }
</style>
</head>
<body>
<p class="normal-text">This text has normal font style</p>
<p class="italic-text">This text will be rendered in italic style</p>
<p class="oblique-text">This text will be rendered in oblique style</p>
</body>
</html>
Example: Inline Font Style
<html>
<head>
</head>
<body>
<p style="font-style: italic;">
This text will be rendered in italic style
</p>
<p style="font-style: oblique;">
This text will be rendered in oblique style
</p>
</body>
</html>
Difference Between Italic and Oblique
| Property Value | Description | Usage |
|---|---|---|
italic |
Uses the italic version of the font if available | Preferred for most cases |
oblique |
Creates slanted text artificially | Fallback when italic font is not available |
normal |
Default upright text | To override inherited italic styles |
Common Use Cases
The font-style property is commonly used for:
- Emphasizing important text or quotes
- Styling book titles, foreign words, or technical terms
- Creating visual hierarchy in typography
- Overriding inherited font styles
Conclusion
The font-style property is essential for controlling text emphasis in CSS. Use italic for most styling needs, as it provides better typography when italic fonts are available.
Updated on: 2026-03-15T23:18:59+05:30
97 Views
Advertisements