CSS property: font-family
Description
This property specifies a prioritized list of font family names or generic family names.
Unlike other CSS properties, component values are a comma-separated list indicating alternatives. A user agent iterates through the list of family names until it matches an available font that contains a glyph for the character to be rendered. This allows for differences in available fonts across platforms and for differences in the range of characters supported by individual fonts.
Syntax
font-family: [ <name> | <generic> ] [, <name> | <generic>]*;
Values
- <name>
The name of a font family.
- <generic>
These keywords can be used as a general fallback mechanism when an author's desired font choices are not available. As keywords, they must not be quoted. Authors are encouraged to append a generic font family as a last alternative for improved robustness.
serif Glyphs of serif fonts, as the term is used in CSS, have finishing strokes, flared or tapering ends, or have actual serifed endings (including slab serifs). Serif fonts are typically proportionately-spaced. They often display a greater variation between thick and thin strokes than fonts from the sans-serif
generic font family. CSS uses the term ‘serif’ to apply to a font for any script, although other names may be more familiar for particular scripts, such as Mincho (Japanese), Sung, Song or Kai (Chinese), Batang (Korean). Any font that is so described may be used to represent the genericserif
family.sans-serif Glyphs in sans-serif fonts, as the term is used in CSS, have stroke endings that are plain -- without any flaring, cross stroke, or other ornamentation. Sans-serif fonts are typically proportionately-spaced. They often have little variation between thick and thin strokes, compared to fonts from the serif
family. CSS uses the termsans-serif
to apply to a font for any script, although other names may be more familiar for particular scripts, such as Gothic (Japanese), Hei (Chinese), or Gulim (Korean). Any font that is so described may be used to represent the genericsans-serif
family.cursive Glyphs in cursive fonts generally have either joining strokes or other cursive characteristics beyond those of italic typefaces. The glyphs are partially or completely connected, and the result looks more like handwritten pen or brush writing than printed letterwork. Some scripts, such as Arabic, are almost always cursive. CSS uses the term cursive
to apply to a font for any script, although other names such as Chancery, Brush, Swing and Script are also used in font names.fantasy Fantasy fonts are primarily decorative fonts that contain playful representations of characters. These do not include Pi or Picture fonts which do not represent actual characters. monospace The sole criterion of a monospace font is that all glyphs have the same fixed width. This is often used to render samples of computer code.
Versions
Examples
body { font-family: Helvetica, Verdana, sans-serif; }