a:visited doesn't work in Mozilla Firefox

问题:

I have created a link and when I try to set the style;

a:visited {
    text-decoration: underline;
    color: #FF0000;
}

It doesnt seem to work. It works fine in IE. I have also followed the order; link, visited, hover, active.
Is this a known issue, or am I making any mistake?

回答1:

It might have to do with specificity and the order that you have your selectors in. In general, when specifying link states, you should follow the "love/hate" principal:

1. :link

2. :visited

3. :hover

4. :active

Maybe you have the :hover or :active selector before :visited?

回答2:

Download the Firebug or WebDeveloper plugin for Firefox and use it to examine the style of the link, say using Inspect, to see where the style is being set. You should be able to see what styles are being applied and from where.

回答3:

i have heard it is to do with the security - so something under the firefox hood disables visited links from showing so that other software cannot inspect the active styles and figure out where a user has been.

that does sort of make sense, but they should make it an option, and they should also EXPLAIN TO PEOPLE THAT THAT IS WHAT THEY HAVE DONE and save us all some time.....

回答4:

Go to Tools -> Options and check if Firefox is remembering your browsing history. If this option is unchecked then the browser cannot show you which links you have visited because you denied the browser that information, hence the reason why your visited links do not change color.

回答5:

Because of security issues that Google/Bing/etc. will be glad to tell you about, only a short list of properties can be styled with the :visited pseudoclass. Text-decoration isn't one of them, though color ought to work.

Depending on what IE version the OP was using when s/he posted this question, the issue there may be incompatibility of IE, especially before IE8, with standards and with other browsers.

More information here (among other places): https://www.w3schools.com/cssref/sel_visited.asp

回答6:

It's likely being overridden by another style. If you have the Web Developer toolbar installed you can see what CSS styles are in affect and where they came from by selecting "View style Information" from the CSS menu.