Web+Friendly+Fonts

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:

Serif Fonts
This is a paragraph || This is a paragraph || This is a paragraph ||
 * ~ font-family ||~ Example text ||
 * Georgia, serif || ==This is a heading ==
 * "Palatino Linotype", "Book Antiqua", Palatino, serif || ==This is a heading ==
 * "Times New Roman", Times, serif || ==This is a heading ==

Sans-Serif Fonts
This is a paragraph || This is a paragraph || This is a paragraph || This is a paragraph || This is a paragraph || <span style="font-family: Tahoma,Geneva,sans-serif;">This is a paragraph || <span style="font-family: 'Trebuchet MS',Helvetica,sans-serif;">This is a paragraph || <span style="font-family: Verdana,Geneva,sans-serif;">This is a paragraph ||
 * ~ font-family ||~ Example text ||
 * Arial, Helvetica, sans-serif || ==<span style="background-color: transparent; font-family: Arial,Helvetica,sans-serif; font-size: 16px;">This is a heading ==
 * "Arial Black", Gadget, sans-serif || ==<span style="background-color: transparent; font-family: 'Arial Black',Gadget,sans-serif; font-size: 16px;">This is a heading ==
 * "Comic Sans MS", cursive, sans-serif || ==<span style="background-color: transparent; font-family: 'Comic Sans MS',cursive,sans-serif; font-size: 16px;">This is a heading ==
 * Impact, Charcoal, sans-serif || ==<span style="background-color: transparent; font-family: Impact,Charcoal,sans-serif; font-size: 16px;">This is a heading ==
 * "Lucida Sans Unicode", "Lucida Grande", sans-serif || ==<span style="background-color: transparent; font-family: 'Lucida Sans Unicode','Lucida Grande',sans-serif; font-size: 16px;">This is a heading ==
 * Tahoma, Geneva, sans-serif || ==<span style="background-color: transparent; font-family: Tahoma,Geneva,sans-serif; font-size: 16px;">This is a heading ==
 * "Trebuchet MS", Helvetica, sans-serif || ==<span style="background-color: transparent; font-family: 'Trebuchet MS',Helvetica,sans-serif; font-size: 16px;">This is a heading ==
 * Verdana, Geneva, sans-serif || ==<span style="background-color: transparent; font-family: Verdana,Geneva,sans-serif; font-size: 16px;">This is a heading ==

A monospaced font, also called a fixed-pitch, fixed-width ornon-proportional font, is a font whose letters and characters each occupy the same amount of horizontal space. This contrasts with variable-width fonts, where the letters differ in size from one another.

<span style="font-family: verdana,helvetica,arial,sans-serif; font-size: 21.33333396911621px;">Monospace Fonts
<span style="font-family: 'Courier New',Courier,monospace;">This is a paragraph || <span style="font-family: 'Lucida Console',Monaco,monospace;">This is a paragraph ||
 * ~ font-family ||~ Example text ||
 * "Courier New", Courier, monospace || ==<span style="background-color: transparent; font-family: 'Courier New',Courier,monospace; font-size: 16px;">This is a heading ==
 * "Lucida Console", Monaco, monospace || ==<span style="background-color: transparent; font-family: 'Lucida Console',Monaco,monospace; font-size: 16px;">This is a heading ==