Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Creating 2 style sheets for links on a page

Reply
Thread Tools

Creating 2 style sheets for links on a page

 
 
Mike Azzopardi
Guest
Posts: n/a
 
      05-04-2006
Hi there

I'm hoping someone can show me how to do this please.
I have a page where I want the links in the menu to act differently to the
links on main page (the colours, mouse over, font etc)

At the moment I have one style sheet that looks like this which is fine for
the main page:

a {
font-family: "Courier New", Courier, mono;
color: #0000FF;
}
body {
font-family: "Courier New", Courier, mono;
font-size: 16pt;
font-weight: bolder;
color: #660000;
}
a:hover {
font-family: "Courier New", Courier, mono;
color: #660000;
}

but I don't know how to make the menu links different. I am using
Dreamweaver MX. And the other thing is I have the Menu as an include file
which looks like this:

document.write('<table width="100%" height="2%" border=0 align="center"
cellpadding=0 cellspacing=0 bordercolor="#FFFFFF" hspace="2">'
+' <tr> '
+' <td bgcolor=#000066> '
+' <div align="center"><font size="4" face="Courier New, Courier,
mono"><strong><a href="../index.html">Home</a> '
+' - <a href="../donate.htm">Donate</a> - <a
href="../artists.htm">Artists</a> '
+' - <a href="../project.htm">The Project</a> - <a
href="../form/index.htm">Sign '
+' Up</a> - <a href="http://www.heifer.org"
target="_blank">Heifer.org</a> '
+' - <a href="../contact.htm">Contact</a> - <a
href="../links.htm">Links</a></strong></font></div></td>'
+' </tr>'
+' <tbody>'
+' </tbody>'
+' </table>');

Any help appriciated.

Best Regards
Mike


 
Reply With Quote
 
 
 
 
Edwin van der Vaart
Guest
Posts: n/a
 
      05-04-2006
Mike Azzopardi wrote:
> Hi there
>
> I'm hoping someone can show me how to do this please.
> I have a page where I want the links in the menu to act differently to the
> links on main page (the colours, mouse over, font etc)

Use class for <a> e.g.
<a class="menu" href="#">option 1</a>
<a class="menu" href="#">option 2</a>
<a class="menu" href="#">option 3</a>

in stylesheet
a.menu {color: #0000FF;}
a.menu:hover {color: #660000;}
--
Edwin van der Vaart
http://www.semi-conductor.nl/ Links to Semiconductors sites
http://www.evandervaart.nl/ Edwin's persoonlijke web site
Explicitly no permission given to Forum4Designers, onlinemarketingtoday,
24help.info and issociate.de to duplicate this post.
 
Reply With Quote
 
 
 
 
Mike Azzopardi
Guest
Posts: n/a
 
      05-04-2006
Thank you Edwin, you've just taught me <A> classes and it all works fine

Thanks again
Mike

"Edwin van der Vaart" <(E-Mail Removed)> wrote in message
news:vIm6g.10686$zc1.350@amstwist00...
> Mike Azzopardi wrote:
>> Hi there
>>
>> I'm hoping someone can show me how to do this please.
>> I have a page where I want the links in the menu to act differently to
>> the links on main page (the colours, mouse over, font etc)

> Use class for <a> e.g.
> <a class="menu" href="#">option 1</a>
> <a class="menu" href="#">option 2</a>
> <a class="menu" href="#">option 3</a>
>
> in stylesheet
> a.menu {color: #0000FF;}
> a.menu:hover {color: #660000;}
> --
> Edwin van der Vaart
> http://www.semi-conductor.nl/ Links to Semiconductors sites
> http://www.evandervaart.nl/ Edwin's persoonlijke web site
> Explicitly no permission given to Forum4Designers, onlinemarketingtoday,
> 24help.info and issociate.de to duplicate this post.



 
Reply With Quote
 
JDS
Guest
Posts: n/a
 
      05-04-2006
On Thu, 04 May 2006 13:14:35 +0000, Mike Azzopardi wrote:

> Thank you Edwin, you've just taught me <A> classes and it all works fine


There are other ways to do it, as well. For example, giving the enclosing
block (in your case a <td> -- a bad idea, but I'll get to that in a
minnit) a class (or id) and then referencing all <a>'s within that
enclosing block.

e.g.

<style type="text/css">
td.menu a{
color: #fff;
}
td.menu a:hover{
color: #000;
}
</style>

<td class="menu">
<a href="butts">Butts</a>
</td>


.... Something like that.

I'd like to point out two glaring issues with your code (that I know you
weren't asking for input on, but I'm giving it anyway):

1) Don't use <FONT> tags!

2) Don't use <TABLE>s for layout


I think (1) is probably more important and easier to do away with. I mean,
you are clearly using CSS for a certain amount of styling already, so why
use <FONT> tags? Oh! I know! DREAMWEAVER. Ugh. DW is fine for some things
but it needs to be carefully reigned in and watched over to prevent it
from doing stuff that it shouldn't.

<soapbox>IMO, the greatest hazard to novice Web Developers is using a
crutch like Dreamweaver to LEARN HTML. Learn HTML very very very well
first, and then, if you like DW's interface or tools or whatever, then
use it. But do not start coding HTML and CSS with DW right away.</soapbox>


allright, later...
--
JDS | http://www.velocityreviews.com/forums/(E-Mail Removed)lid
| http://www.newtnotes.com
DJMBS | http://newtnotes.com/doctor-jeff-master-brainsurgeon/

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
how do I get the style sheets (or style object) of the wholedocument? Jake Barnes Javascript 6 04-12-2009 08:15 AM
Master Page prevents using style sheets? JT ASP .Net 8 09-08-2006 06:56 PM
Firefox not recognizing style sheets Elyse Sommer Firefox 6 06-01-2005 01:30 AM
Style sheets, include one style within another (not inheritance) foldface@yahoo.co.uk HTML 1 11-24-2003 01:37 PM
export to Excel - multiple sheets & renaming sheets Carl Corcoran ASP General 1 11-12-2003 07:28 PM



Advertisments