PROPERTY: font-weight
font-weight : normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
 
Compatibility:  IE4+  N4+
Version: Level 1
Inherited: Yes
 
The font-weight property allows you to choose how thick or thin the characters of a text appear. This is referred to as boldness. Boldness is a relative, not fixed, quantity which is determined by your individual computer and/or browser.
 
Many browsers only recognize normal and bold font weight.
 
normal
 
The normal value is the default. On the numeric scale running from 100 to 900, normal is usually considered to be 400. By declaring normal, you can ensure that any previous declaration will not effect a selected text.
 
bold
 
The bold value corresponds to the <B> tag in HTML. On the numeric scale running from 100 to 900, bold is usually considered to be 700.
 
bolder
 
The bolder value makes the character appear thicker in size and, hence, increases the boldness. The amount of change will be determined by the individual computer/browser.
 
lighter
 
The lighter value makes the character appear thinner in size and, hence, decreases the boldness. The amount of change will be determined by the individual computer/browser.
 
100 ... 900
 
The 100,200,300,400,500,600,700,800,900 values provide nine steps in range of boldness. The larger the number, the greater the boldness. This is a relative numeric scale where 400 usually equates to normal and 700 to bold. The amount of change caused by each step will be determined by the individual computer/browser.
 
Code:
p { font-weight: normal; }
p { font-weight: bold; }
p { font-weight: bolder; }
p { font-weight: lighter; }
p { font-weight: 600; }
 
or
 
<span style="font-weight: 100;">100 </span>
<span style="font-weight: 200;">200 </span>
<span style="font-weight: 300;">300 </span>
<span style="font-weight: 400;">400 </span>
<span style="font-weight: 500;">500 </span>
<span style="font-weight: 600;">600 </span>
<span style="font-weight: 700;">700 </span>
<span style="font-weight: 800;">800 </span>
<span style="font-weight: 900;">900 </span>
 
Output:
lighter
normal
bold
bolder
100
200
300
400
500
600
700
800
900


Copyright 1999-2001 by Infinite Software Solutions, Inc. All rights reserved.
Trademark Information