Question

波纹管代码在Chrome上运行正常，但悬停效果并未在Firefox上应用。

HTML

<!DOCTYPE html>
<html>
    <head>
        <link type="text/css" rel="stylesheet" href="stylesheet.css"/>
        <title></title>
    </head>
    <body>
        <div>
        <a href="http://www.w3schools.com/cssref/pr_background-image.asp">
        1 Link
        </a>
        </div>
    </body>
</html>

CSS

a:Link {
text-decoration:none;
color:#008B45;
}
a:hover {
color:black;    
}
a:visited {
color:#EE9A00;   
}

关于这个问题的任何想法？

Answer 1

您已访问过Firefox中的链接。

:visited规则在:hover规则之后应用，因此它会覆盖它。

如果您希望将:hover样式应用于悬停的访问过的链接，请重新排序您的CSS，以便在:visited之后显示:hover。

Answer 2

将悬停状态设置为已访问，并且可以正常工作

a:Link {
text-decoration:none;
color:#008B45;
}
a:visited {
color:#EE9A00;   
}
a:hover {
color:black;    
}

http://jsfiddle.net/58M6h/

a：Firefox上的悬停问题

2 个答案: