CSS: Font Weight, Bold

By Xah Lee. Date: . Last updated: .

Here's different values for the CSS property font-weight as shown in your browser.

font-weight:bold

font-weight:normal

font-weight:lighter

font-weight:200

font-weight:400

font-weight:700

font-weight:900

Note: values other than bold or normal may not have any effect. It requires a font family that supports light version. Google Webfont Open Sans supports light weight. 〔►see Google Webfont Tutorial

syntaxmeaning
font-weight:normalnormal. Same as 400
font-weight:boldbold. Same as 700
font-weight:bolder100 bolder than parent
font-weight:lighter100 lighter than parent
font-weight:integer400 = normal, 700 = bold
syntaxmeaning
font-weight:initialbrowser default
font-weight:inheritinherit from parent

Thanks to Federico Totti, A1Den Liu for help.

Font Topic

Like what you read? Buy JavaScript in Depth