Hyperlinks and using different colours

[bloodofeve]

I am currently working on a site for a client who has decided that they want different colour hyperlinks in different areas of the site currently it is set like this:

a,  a:link {
  color: #99cc00;
  font-weight: bold;
  text-decoration: none;
}
/* Sets the style for visited links. */
a:visited {
  color: #ff6699;
  font-weight: bold;
  text-decoration: none;
}
/* Sets the style for links on mouseover. */
a:hover {
  color: #A1CBDE;
  text-decoration: underline;
}
/* Sets the style for a link that has focus. */
a:focus {
  color: #A1CBDE;
}
/* Sets the style for a link that is being activated/clicked. */
a:active {
  color: #ff9900;
}
/* Sets the style for unvisited links. */

What I'm not sure about is how I can set each pages' hyperlink with a different set of colours, should I do this as a class or can I produce a rule like this? :-

a1,  a1:link {
  color: #ff9900;
  font-weight: bold;
  text-decoration: none;
}
/* Sets the style for visited links. */
a1:visited {
  color: #ff6699;
  font-weight: bold;
  text-decoration: none;
}
/* Sets the style for links on mouseover. */
a1:hover {
  color: #99cc00;
  text-decoration: underline;
}
/* Sets the style for a link that has focus. */
a1:focus {
  color: #A1CBDE;
}
/* Sets the style for a link that is being activated/clicked. */
a1:active {
  color: #ff9900;
}

Just need some advice.

[Paul O'B]

Hi,

There is no element called a1 so you can't use that approach

Just use a class instead.

a.test,  a.test:link {etc.... }

The CSS faq has a small tutorial on this that you might find useful.

http://www.sitepoint.com/forums/show...64&postcount=2

[tom_tom_10]

Yeah in addition the different areas of the site are likley to already have different classes set to them so you could just do something like:

.site-area-class a { }

Rather than setting a class to each individual link, unless it is very specific. then you might need to add a class to the a's.

[bloodofeve]

Hi Guys,
thanks for the info.
Paul I decided to go with your suggested method, which worked perfectly.
Many thanks for pointing me in the correct direction.