Font Family Using Style Sheet - CSS (HTML) Tutorial

Tutorials

Css

Topic

How to set verdana or arial style font type to my text?
How to set font family in html using style sheet?

Explanation

Property: Font Family

Usage:
font-family: [ [family-name | generic-family], ]*;

Definition:

The font family can be set using this tag in style sheet.There are numerous font families like serif, cursive, monospace etc....
Many font families can be set in order. This is usually done because when the first family is not supported by the browser or not present the second is used and so on..
It takes the following values.
a)font-family | generic-family : e.g: serif , cursive , monospace

Example 1:

<div style="font-family: serif;">testing font family</div>

Result:

testing font family

Example 2:

<div style="font-family: courier;">testing font family </div>

Result:

testing font family

Example 3:

<div style="font-family: fantasy;">testing font family </div>

Result:

testing font family

Example 4:

<div style="font-family: tims, cursive, serif;">testing font family </div>

Result:

testing font family

Note: In this example we have set three font-families. As the first family(tims - a junk value) will not be available, the second one "cursive" is taken.

Most commonly used font types that are available in most platforms are Verdana, Arial, helvetica, san-serif.

Some other example Values you can use: serif, san-serif, cursive, monospace, fantasy, "times new roman", "new century schoolbook", helvetica, times, courier, western.

CSS Font Family