Commonly Used Font Combinations
The font-family property should hold several font names as a "fallback" system, to ensure maximum compatibility between browsers/operating systems. If the browser does not support the first font, it tries the next font.Start with the font you want, and end with a generic family, to let the browser pick a similar font in the generic family, if no other fonts are available:
Example
|
Serif Fonts
font-family | Example text |
---|---|
Georgia, serif | This is a headingThis is a paragraph |
"Palatino Linotype", "Book Antiqua", Palatino, serif | This is a headingThis is a paragraph |
"Times New Roman", Times, serif | This is a headingThis is a paragraph |
Sans-Serif Fonts
font-family | Example text |
---|---|
Arial, Helvetica, sans-serif | This is a headingThis is a paragraph |
Arial Black, Gadget, sans-serif | This is a headingThis is a paragraph |
"Comic Sans MS", cursive, sans-serif | This is a headingThis is a paragraph |
Impact, Charcoal, sans-serif | This is a headingThis is a paragraph |
"Lucida Sans Unicode", "Lucida Grande", sans-serif | This is a headingThis is a paragraph |
Tahoma, Geneva, sans-serif | This is a headingThis is a paragraph |
"Trebuchet MS", Helvetica, sans-serif | This is a headingThis is a paragraph |
Verdana, Geneva, sans-serif | This is a headingThis is a paragraph |
Monospace Fonts
font-family | Example text |
---|---|
"Courier New", Courier, monospace | This is a headingThis is a paragraph |
"Lucida Console", Monaco, monospace | This is a headingThis is a paragraph |