CSS Font Weight
To create bold or bolder or lighter weight font in html using style sheet.
Explanation
Property :
Font WeightUsage:
font-weight: bold;
font-weight: bolder;
font-weight: light;
font-weight: lighter;
font-weight: 100;
font-weight: normal;
Definition:
This parameter controls the weight or boldness of the font. We can make the font look lighter or bolder using style sheet.
It takes the following values.
a) bold : It makes the font to look bold.
b) bolder : It makes the font to look bolder.
c) light : It makes the font to look light.
d) lighter : It makes the font to look lighter.
e) 100 to 900 : The fonts boldness can be set using values as 100 or 200 or 300 or 400 or 500 or 600 or 700 or 800 or 900.
f) normal : It sets the fonts as normal fonts.
It takes the following values.
a) bold : It makes the font to look bold.
b) bolder : It makes the font to look bolder.
c) light : It makes the font to look light.
d) lighter : It makes the font to look lighter.
e) 100 to 900 : The fonts boldness can be set using values as 100 or 200 or 300 or 400 or 500 or 600 or 700 or 800 or 900.
f) normal : It sets the fonts as normal fonts.
Example 1:
<div style="font-weight: bold;">testing font weight </div>
Result:
testing font weight
Example 2:
<div style="font-weight: bolder;">testing font weight </div>
Result:
testing font weight
Example 3:
<div style="font-weight: light;">testing font weight </div>
Result:
testing font weight
Example 4:
<div style="font-weight: lighter;">testing font weight </div>
Result:
testing font weight
Example 5:
<div style="font-weight: 800;">testing font weight </div>
Result:
testing font weight
Example 6:
<div style="font-weight: normal;">testing font boldness </div>
Result:
testing font boldness
