CSS font-style Property
It is used to specify the font style of an HTML element. It can be “normal, italic or oblique”.
Syntax:
font-style: style name;
Example: In this example with CSS: ‘gfg’ class uses bold ‘Times New Roman’ font, 40px size, green color, centered text; ‘geeks’ class applies italic font style with centered text.
<!DOCTYPE html>
<html>
<head>
<title>font-style property</title>
<style>
.gfg {
font-style: normal;
font-family: "Times New Roman";
font-weight: bold;
font-size: 40px;
color: #090;
text-align: center;
}
.geeks {
font-style: italic;
text-align: center;
}
</style>
</head>
<body>
<div class="gfg">w3wiki</div>
<div class="geeks">
A computer science portal for geeks
</div>
</body>
</html>
Output:
CSS Fonts
CSS fonts are used to style the text within HTML elements. The font-family property specifies the typeface, while font-size, font-weight, and font-style control the size, thickness, and style of the text. Combining these properties enhances the typography and readability of web content.
Example: In this example, we will use a few CSS Font properties.
<!DOCTYPE html>
<html>
<head>
<title>CSS Font</title>
<style>
.gfg {
font-family: "Arial, Helvetica, sans-serif";
font-size: 60px;
color: #090;
text-align: center;
}
.geeks {
font-family: "Comic Sans MS", cursive, sans-serif;
font-variant:small-caps;
text-align: center;
}
</style>
</head>
<body>
<div class="gfg">w3wiki</div>
<div class="geeks">
A computer science portal for geeks
</div>
</body>
</html>
Output:
There are many font properties in CSS which are mentioned and briefly discussed below:
Below few examples are given from CSS Font Collection :
Table of Content
- CSS font-family Property
- CSS font-style Property
- CSS font-weight Property
- CSS font-variant Property
- CSS font-size Property
- CSS font-stretch Property
- CSS font-kerning Property
Contact Us