Changing fonts in a stylesheet
Article ID: KB101640
To change fonts in a stylesheet, open the stylesheet (.css) file and look for
code that looks like this, and edit it:
font-family: Verdana, Arial, Helvetica, sans-serif;
or
font: ........ Verdana, Arial, Helvetica, sans-serif;
Sometimes there may be just one font listed, sometimes there may be several
fonts listed. The reason why you may want to list several fonts is because not
every font is guaranteed to be on every viewer's computer. So in the font
definition above, the first default font listed is Verdana. If for some reason
your site viewer doesn't have the Verdana font on their system, the browser will
then try to display the text in the Arial font. If they don't have Arial, the
browser looks for Helvetica. If they don't have Helvetica, the default
"sans-serif" font is displayed instead.
This is why it's important for you to use "generic" fonts that many people
will have on their systems, and to stay away from "fancy" fonts that you may
have downloaded for free, or that come on PC's but not on Macs.
If you change a font in your stylesheet, but there is an area in your web
page that wasn't affected, you may have to look for other places where the font
is referenced. For example, let's say that you change the default h1 font
definition. When you preview your web page, most of the first-level headings are
affected, but all the headings in the left column haven't changed. What's very
likely in this case is that the developer has defined a special h1 style for the
left column only. You'll want to look in the stylesheet for the class or ID
selector of the left column - it may look something like class="leftcolumn",
id="body2", id="left", within a table cell (<td>) or div (<div>) -- this will
vary depending on the way the designer has set it up. Then, look in the
stylesheet for other instances of h1 that are next to that class or selector.
For example, it may look something like this:
#leftcolumn h1 { font .... }
If you still cannot figure out how to change the font for a particular area,
contact the developer of the template for assistance.
Was this helpful?
Please rate this article:
Email address: (not required)
(Please provide your email address if you would like PixelMill support to follow-up with you about your comment. You're email address is NOT REQUIRED to submit a comment.)
Comments: (How can we improve this article?)
Clicking "Submit" will not clear this page.
link to this page:
http://www.pixelmill.com/support/al0/kb101640.htm
permalink to this article:
http://www.pixelmill.com/support/kb101640.htm
Back to top