Font-Weight Property :
- font-weight property Specifies the boldness of the text
- All the above values are accepted by the font-weight property,
- In real time only two values are used i.e normal and bold.
- Normal text usually equates to a font-weight value of 400
- Bold text have equivalent font-weight value of 700.
Different Possible Values Accepted :
normal | bold | bolder | lighter |
100 | 200 | 300 | 400 | 500 |
600 | 700 | 800 | 900
Live Example :
<html>
<head>
<style>
p.b100{font-weight:100}
p.b200{font-weight:200}
p.b300{font-weight:300}
p.b400{font-weight:400}
p.b500{font-weight:500}
p.b600{font-weight:600}
p.b700{font-weight:700}
p.b800{font-weight:800}
p.b900{font-weight:900}
</style>
</head>
<body>
<p class="b100">Font Weight : 100px</p>
<p class="b200">Font Weight : 200px</p>
<p class="b300">Font Weight : 300px</p>
<p class="b400">Font Weight : 400px</p>
<p class="b500">Font Weight : 500px</p>
<p class="b600">Font Weight : 600px</p>
<p class="b700">Font Weight : 700px</p>
<p class="b800">Font Weight : 800px</p>
<p class="b900">Font Weight : 900px</p>
</body>
</html>
Output :
