Internal USGS Access Only

Cascading Style Sheets, Fonts

Classification: Serif vs. Non-Serif

Serif		Sans-Serif
A		A

Classification: Proportional vs. Non-Proportional

Proportional		Non-Proportional
iiiii wwwww		iiiii wwwww

The default is for proportional fonts. Non-proportional fonts can be obtained:

From the tags CODE, PRE, SAMP and TT
Using the font Courier
By specifying the font family to be category monospace
```
    font-family: monospace
```

Font Family

Arial	Courier	Verdana	Bookman
A small sample of text	A small sample of text	A small sample of text	A small sample of text

    font-family: Arial

    font-family: Courier

    font-family: Verdana

    font-family: Bookman

One should always specify a font cascade so that the most appropriate font substitution can be made if the desired font is not available. Font names should be separated by commas. For example:

    font-family: Helvetica, Arial, sans-serif

The last entry should always be one of monospace, serif, sans-serif, cursive (script-like) or fantasy (decorative).

Other Properties

Italic	Bold	Underline	Line-Through
A small sample of text	A small sample of text	A small sample of text	A small sample of text

    font-style: italic

    font-weight: bold

    text-decoration: underline

    text-decoration: line-through

Example

The style would be set in the HEAD section:

<style type="text/css">
        .example {
        font-size: 1.5em;
        font-family: "Comic Sans MS", Verdana, sans-serif;
        font-style: italic;
        color: green;
  }
</style>

And then used within the BODY:

<p class="example">Now is the time for all good men...</p>

Now is the time for all good men...

Font families with spaces in their names should be quoted.

Searching the Internet on the topic of fonts common to Macintosh and Windows leads to the depressing conclusion that there are perhaps a half-dozen fonts which one could reasonably expect to exist on most systems.

Common fonts commonly used for text other than titles or labels would be Helvetica, Times, Arial, and Verdana.

slide 23

"Mastering a Web Site" online course
Created and maintained by Lorna Schmid and David Boldt.
http://water.usgs.gov/usgs/training/webmaster/css_fonts.html
Last modified: Wed Oct 15 19:09:42 EDT 2003