Override CSS Link Color?

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View

Have a web site which uses a CSS file.  There is one link which I would like
to change the colors for the A:link, A:visited, and A:hover.  Is there
something I can put in the HTML code to override the CSS values?

Re: Override CSS Link Color?

Al Franz wrote:

Quoted text here. Click to load it

These changes do not belong into the HTML code. The purpose of external CSS
files is to keep such presentational stuff seperate from the document.

The only thing you need to change in your HTML is adding a 'class' attribute
to this special link, e.g.
  <a class="specialLink" href="...">...</a>

Then add rules in your CSS file like

a.specialLink:link { color: white; }
a.specialLink:visited { color: black; }
a.specialLink:hover { color: red; }

Benjamin Niemann
Email: pink at odahoda dot de
WWW: http://www.odahoda.de /

Re: Override CSS Link Color?

On Mon, 20 Jun 2005 14:20:20 -0700, "Al Franz"

Quoted text here. Click to load it

The "C" in "CSS" stands for "Cascading".  The whole protocol is designed
to allow this to be done easily.

Use an in-line stylesheet like this:


< ... existing stuff .. >

<style type="text/css" >

a:link {
a:visited {
a:hover {
a:active {



More stuff....

With CSS' default behaviour, you'll still use the existing external
stylesheet, but you'll overwrite these specific rules with the internal
stylesheet. This obviously only applies to a page which contains this
internal stylesheet.

If you don't want to do this to all links, start using a class attribute
on them. If you want to do it to multiple pages, also consider using
class, with an external stylesheet.

The order of the pseudo-classes :hover etc. is significant.

Go read a good book, like Lie & Bos, on CSS

Site Timeline