© Copyright 2003 by BasicTips.com, division of BasicTemplates.com
This is
the third article in a series of "Cheap Tricks with CSS". This little
trick will change the overall cosmetic appearance of your web site
by simply changing the font face that is controlled by CSS (cascading
style sheets).
Oh no! I think I just heard some shrill screams from all those web
designers out there who use ordinary HTML. ;) And I do believe I
heard some heavy sobbing from all those web template designers out
there who use ordinary HTML. LOL ... not to worry though. Since
you are a frequent visitor to BasicTemplates.com and likely a happy
member, YOU are using external CSS to control your fonts, because
you are a smart cookie, right?
If so, here is the cheap font trick of the week to help you quickly
change the look of your site on all pages within seconds.
The most effective way to use CSS throughout your site is by using
an external (linked) style sheet. Open the style sheet with any
text editor such as Windows Notepad or NoteTab
(there are many others). Edit the font-family tag everywhere it
appears in the style sheet.
Before:
font-family: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
After:
font-family: Georgia;
Now let's compare two pages on our web site. The first
page is using the font-family in the first example. The second
page is using the font-family in the second example. Pretty
cool, huh? Do you see how much different the pages appear? Nice
change.
Keep in mind that different font families have size variations.
By doing this you may need to change the font-size as well. In this
case we did not. If you are using a smart text editor such as NoteTab,
the process can be even quicker. (If you can imagine anything quicker
and simpler!) by using the "find and replace" function within the
software.
Note that if you are using a font-family who's name is more than
one word such as "Trebuchet MS", you must use quotation marks around
the font-family name as we did in the example above.
Now we ask, why would anyone utilize, purchase or design a web site
or template without external CSS?
Related Articles: Cheap
"Link" Tricks, Part 1 and Cheap
"Link: Tricks, Part 2.
Return to CSS Tutorial Index
Get
your Business Domain Name for only $9.95,
Right Here, Right Now!
|