Font family (HTML)
From Wikipedia, the free encyclopedia
HTML |
---|
|
In HTML and XHTML, a font face or font family is the typeface that is applied to some text.
The font family and other presentational attributes of fonts are applied in HTML code using Cascading Style Sheets (CSS) or the deprecated HTML font
element.
<p style="font-family: times, serif">Sample text formatted with CSS.</p> <p><font face="times, serif">Sample text formatted with the deprecated FONT tag.</font></p>
It is common for publishers to define a list of font families to use when rendering text. These are listed in preferential order, separated by commas (as can be seen above). In this situation, the term font-family (or, in the case of HTML, face) is often misunderstood to mean the collection of possible fonts to use when rendering the text (be it on screen, on a printer or otherwise). In fact the list is that of several different font families, each family being of similar fonts. Thus the Times family includes different styles (like roman and italic), and weight (like regular and bold). The last family specified is usually one of the five generic families defined in HTML and CSS, to allow the text to be rendered appropriately even if the specified fonts are not available on that system.
Contents |
[edit] CSS generic font families
The generic font families defined in HTML and CSS are:[1]
Family | Example (browser dependent) |
---|---|
serif | The quick brown fox jumps over the lazy dog. |
sans-serif | The quick brown fox jumps over the lazy dog. |
cursive | The quick brown fox jumps over the lazy dog. |
fantasy | The quick brown fox jumps over the lazy dog. |
monospace | The quick brown fox jumps over the lazy dog. |
Under Windows API, these families are identified as Roman, Swiss, Script, Decorative, and Modern, respectively.
[edit] Generic font
The font-family can use a specific named font (like Heisei Mincho W9) but the result depends on the installed fonts in the user machine. Font names must be quoted if containing whitespaces. The actual appearance will depend on your browser and the fonts installed on your system.[1] A default installation of Microsoft's Internet Explorer, for instance, always displays serif and Times as Times New Roman, and sans-serif and Helvetica as Arial.
[edit] Notes
[edit] See also
Font | Example (dependent on installed fonts) |
---|---|
Times New Roman | The quick brown fox jumps over the lazy dog. |
Roman | The quick brown fox jumps over the lazy dog. |
Garamond | The quick brown fox jumps over the lazy dog. |
Palatino | The quick brown fox jumps over the lazy dog. |
Antiqua | The quick brown fox jumps over the lazy dog. |
Minion | The quick brown fox jumps over the lazy dog. |
Helvetica | The quick brown fox jumps over the lazy dog. |
Swiss | The quick brown fox jumps over the lazy dog. |
Impact | The quick brown fox jumps over the lazy dog. |
Script | The quick brown fox jumps over the lazy dog. |
Decorative | The quick brown fox jumps over the lazy dog. |
Blackletter | The quick brown fox jumps over the lazy dog. |
Fraktur | The quick brown fox jumps over the lazy dog. |
Comic Sans | The quick brown fox jumps over the lazy dog. |
Modern | The quick brown fox jumps over the lazy dog. |
Courier | The quick brown fox jumps over the lazy dog. |
Calibri | The quick brown fox jumps over the lazy dog. |
Verdana | The quick brown fox jumps over the lazy dog. |
Frosty | The quick brown fox jumps over the lazy dog. |
Georgia | The quick brown fox jumps over the lazy dog. |