Difference between revisions of "CSS GUIDE FONT WEIGHT"

From CDOT Wiki
Jump to: navigation, search
m (Specification Conformance)
Line 55: Line 55:
== Specification Conformance  ==
== Specification Conformance  ==
*[http://www.w3.org/TR/CSS1#font-weight CSS 1 ]
*[http://www.w3.org/TR/CSS1#font-weight CSS 1 ]
*[http://www.w3.org/TR/CSS21/fonts.html#font-weight-props CSS 2.1]
*[http://www.w3.org/TR/CSS21/fonts.html#font-boldness CSS 2.1]
*[http://www.w3.org/TR/css3-fonts/#font-weight-props CSS 3]
*[http://www.w3.org/TR/css3-fonts/#font-weight-props CSS 3]

Revision as of 18:42, 14 December 2006

This document is a work in progress and is subject to change.


The font-weight property is used to control the weight or boldness of a font for a defined section. The weight can be declared absolutely or relatively to the parent or user's default font size.

Applicability:The font-weight property can be used for all CSS elements.
Media Group: Visual


TARGET_ELEMENT { font-weight: normal }  
TARGET_ELEMENT { font-weight: 700 }  
TARGET_ELEMENT { font-weight: bolder } 

Legal Values

Values can be entered in 3 ways:

Numeric Value100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900'400' represents normal weight, '700' represents bold weight
Relative Weightlighter | bolder(Relative to parent or user font table)
Boolean Weightnormal | bold12pt.

See usage examples section for more details.

Mozilla Recommended Values

Usage Examples

p{font-weight: bold}  /*Set paragraph text to be bold.*/
h1{font-weight: 500}  /*Set h1 (level 1 heading) text to one step darker than normal but less than a standard bold.*/
span{font-weight: lighter}  /*Sets text enclosed within span tag to be one step lighter than the parent or user font table*/


The World Wide Web Consortium (W3C) provides a free online CSS validation service.

Specification Conformance

Browser Compatibility

See Also