DevGuru CSS2: font-weight

Quick References

Features

Partners

			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