WEB DESIGN GARAGE [Electronic resources] نسخه متنی

Chapter 47. Controlling the Typeface

Normally, a browser displays text in its default typeface or font, which is almost always Times New Roman on Windows computers. HTML offers the creaky font tag to let you change the typeface for a particular section of text. The font tag works like this:

<p>
<font face="Arial">This paragraph displays in Arial.</font>
</p>

The value of the face attribute is the name of the font that you want to use.

You may play with the position of the font tags to apply the font to several text elements in a row:

<font face="Arial">
<h1>This header displays in Arial.</h1>
<p>So does this paragraph.</p>
<p>So does this paragraph.</p>
</font>

But now that CSS is here, you don't need the font tag. The font-family attribute performs the same function. You can add it to the style definition of an HTML tag:

p {
font-family: Arial;
}

or a class style:

.arialtext {
font-family: Arial;
}

CSS makes typeface management easier, too. If you define a style rule so that all paragraphs display in Arial, as in the first CSS example, you can forget about those annoying font tags. Whenever you add a paragraph to your page, it automatically displays in Arial.

It gets better. Let's say you want all the text on a page to display in Arial. Simply put the font-family attribute in the style rule for the body tag:

body {
font-family: Arial;
}