The font-weight
property is used in CSS and certain HTML elements. It is used to specify the weight or boldness of the text, or font.
Values[]
Value | Description |
---|---|
100 200 300 400 500 600 700 800 900 |
These numbers are used to provide a more specific amount of boldness to the font. 100 -500 are for a lighter weight, while 600 -900 are used for a heavier weight.
|
normal |
Normal font weight, same as the 400 value.
|
bold |
Bold font weight, same as the 700 value.
|
lighter |
One font weight lighter than the parent element. |
bolder |
One font weight darker than the parent element. |
HTML example:
<span style="font-family:Arial; font-weight:normal;">Normal font.</span>
That will produce: Normal font.
This is font with the bold
value applied: Bold font.
This is font with the lighter
value applied: Lighter font.
This is font with the bolder
value applied: Bolder font.
This is font with the 100
value applied: 100 font.
This is font with the 900
value applied: 900 font.
CSS example:
h1 {
font-family:Arial;
font-weight:normal;
}