will css overwrite already alplied fonts?

  • Thread starter Thread starter LisaB
  • Start date Start date
L

LisaB

If I have already gone thru evey page and added the fonts
and the size will a css overwrite it or not?

and watch tag is for the hyperlinks? and the navagation
bar text.

thanks


Lisa
 
'Best practices' would be to get rid of all the font tags and then apply the
CSS styles. Best of course is to not use the font tags in the first place.
don't forget to go to the HELP files.
Eleanor
 
Which version of FP are you using. CSS is much easier now in FP2003.
Or...Download a trial version of Top Style and read their directions.
That's entirely up to you when you build a CSS stylesheet. Maybe looking at
this one will help. But , then again it might confuse.
Stylesheetfile
http://www.eleanorstravels.com/CSSStyles/duskygreen.css


a.. BODY
a.. H1
a.. H2
a.. H3
a.. H4
a.. A:link
a.. A:visited
a.. A:hover
a.. A:active
a.. P
a.. A
a.. .style1
BODY
{
backgroundColor: #ffffff;
cssText: COLOR: #000000; FONT-FAMILY: Verdana, Arial, Helvetica,
sans-serif; BACKGROUND-COLOR: #ffffff;
accelerator: false;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #000000;

}
H1
{
fontWeight: bold;
textDecorationNone: true;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #66728a; FONT-FAMILY:
Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none;
accelerator: false;
fontSize: 18px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
textDecoration: none;
color: #66728a;

}
H2
{
fontWeight: bold;
textDecorationNone: true;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #8a6684; FONT-FAMILY:
Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
textDecoration: none;
color: #8a6684;

}
H3
{
fontWeight: bold;
textDecorationNone: true;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #5a4266; FONT-FAMILY:
Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
textDecoration: none;
color: #5a4266;

}
H4
{
fontWeight: normal;
textDecorationNone: true;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #d0d4d3;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none;
accelerator: false;
fontSize: 12px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
textDecoration: none;
color: #d0d4d3;

}
A:link
{
fontStyle: normal;
fontWeight: bold;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #ffffff; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #ffffff;

}
A:visited
{
fontStyle: normal;
fontWeight: bold;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #ffffff; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #ffffff;

}
A:hover
{
fontStyle: normal;
textDecorationUnderline: true;
fontWeight: bold;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 14px; COLOR: #ffffff; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION:
underline;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
textDecoration: underline;
color: #ffffff;

}
A:active
{
fontStyle: normal;
fontWeight: bold;
textTransform: capitalize;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 14px; TEXT-TRANSFORM: capitalize;
COLOR: #ffffff; FONT-STYLE: normal; FONT-FAMILY: Verdana, Arial, Helvetica,
sans-serif;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #ffffff;

}
P
{
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 14px; COLOR: #333333;
FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #333333;

}
A
{
fontStyle: normal;
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #ffffff; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 12px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #ffffff;

}
..style1
{
fontStyle: oblique;
fontWeight: bolder;
cssText: FONT-WEIGHT: bolder; FONT-SIZE: 16px; COLOR: #758279; FONT-STYLE:
oblique; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 16px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #758279;

}
 
Here's a less complicated one:
Stylesheetfile
http://www.eleanorstravels.com//tasmaniaCSS.css


a.. BODY
a.. H1
a.. H4
a.. H2
a.. A:link
a.. A:visited
a.. A:hover
a.. A:active
BODY
{
backgroundColor: #ffffff;
cssText: FONT-FAMILY: Verdana, Geneva, Arial, helvetica, sans-serif;
BACKGROUND-COLOR: #ffffff;
accelerator: false;
fontFamily: Verdana, Geneva, Arial, helvetica, sans-serif;

}
H1
{
fontStyle: normal;
fontWeight: bold;
cssText: FONT-WEIGHT: bold; FONT-SIZE: 16px; COLOR: #336633; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 16px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #336633;

}
H4
{
fontStyle: normal;
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #336633; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 12px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #336633;

}
H2
{
fontStyle: normal;
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 14px; COLOR: #336633; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 14px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #336633;

}
A:link
{
fontStyle: normal;
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #006666; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 12px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #006666;

}
A:visited
{
fontStyle: normal;
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #993300; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif;
accelerator: false;
fontSize: 12px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
color: #993300;

}
A:hover
{
fontStyle: normal;
textDecorationUnderline: true;
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #006666; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION:
underline;
accelerator: false;
fontSize: 12px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
textDecoration: underline;
color: #006666;

}
A:active
{
fontStyle: normal;
fontWeight: normal;
cssText: FONT-WEIGHT: normal; FONT-SIZE: 12px; COLOR: #006699; FONT-STYLE:
normal; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION:
overline;
textDecorationOverline: true;
accelerator: false;
fontSize: 12px;
fontFamily: Verdana, Arial, Helvetica, sans-serif;
textDecoration: overline;
color: #006699;

}
Eleanor
 
Using FP 2000 can't decide if it's worth chaning the whoe
thing; I've already applied all the fonts and sizes. But
then again, it may be better down the road?

Thanks

Lisa
 
Font tags will over write the CSS. CSS stands for Cascading Style Sheets
which means style information cascades. Closer to the end product will over
write anything further away.

Inline styles (includes font tags) = 1
Head section of page = 2
External stylesheet = 3

The lower the number the higher the priority. So if your external stylesheet
said all text was to be "Arial and black" and the head section said h1
would be "Times New Roman" the h1 tags would all be rendered in black Times
New Roman. But if you had <font color="red"><h1>Heading</h1></font> or <h1
style="color: red">Heading</h1> would both be red, Times New Roman.

As other mentioned removing font tags is best practice and makes it easier
to maintain a consistent look and feel when you make changes in the future.
 
Back
Top