From the author of

From the author of

The HTMinimaList designer eschews Flash and gaudy DHTML gimmicks. So
what's left? First and foremost, HTMinimaLists focus on making HTML text
look good. And the trick to good-looking HTML text is a decent understanding of
fontography and color, coupled with your secret weapon: Cascading Style
Sheets!

CSS Font Control

Here is some good, safe, basic, cross-browser CSS code that will make your
HTML text look better. There are as many ways to structure your style sheets as
there are people with opinions. These are just my default preferences.

First, create a plain text document using the following text, and save it as
styles.css:

<html>
<head>
<title>CSS font default example</title>
<LINK REL=STYLESHEET TYPE="text/css" HREF="styles.css">
</head>
<body>
<span class=large>
This Is 18px Georgia For Headers
</span>
<p>
<span class=medium>
This is the 12px Verdana for your main body text.<br>
And here's a line break to show the leading.<br>
And here's <a href="nowhere.html">a link</a>.
</span>
<p>
<span class=small>
This is the 9px Verdana for wee information.<br>
Again, a line break to show the leading.
</span>
</body>
</html>

Store both documents in the same directory, and your HTML page should look
something like Figure
1).

Let's take a cursory look at how all this works. In the CSS document,
12px/18px sets the font size to 12 pixels and the line leading to 18
pixels.

The A and A:hover lines tell the browser, "Don't
underline links until they are moused over" (A:hover is woefully
unsupported in Netscape 4).

The fonts are listed in order of preference. If none of the specified fonts
is available on the user's machine, the browser will substitute its own
default fonts.

In the HTML document, the <LINK REL=STYLESHEET
TYPE="text/css" HREF="styles.css"> line must be
present, or the styles will not be applied. The <span> tag is
just a generic division tag that can be applied to any text. When your CSS class
attribute is added, <span> modifies the text, which it surrounds
accordingly.

Be warned that surrounding a table with <span> tags will
not change the text within the table's data cells. To do that, you
either have to:

Put the modified <span> tags at the beginning and end of
every block of text that you want to modify, data cell by data cell (a
pain).

Specify <td class="yourclass"> for the data
cells that contain the text that you want to modify (a bit more
elegant).