单击后如何更改超链接的颜色

时间:2013-06-12 09:57:22

标签: html css

我想在点击后更改超链接的颜色,但是剩余的超链接颜色也会改变。

CSS

a:active {
    color: gray;
}
a:visited {
    color:black;
}

HTML

<body> 
    <a href="link1.html">a</a>
    <a href="link2.html">b</a>
    <a href="link3.html">c</a> 
</body>

2 个答案:

答案 0 :(得分:9)

:visited伪类适用于浏览器的历史记录。所有三个链接都是用黑色绘制的事实意味着您的浏览器过去曾访问过它们。如果您要清除历史记录或更改链接的网址,您会发现它们并未归类为“已访问”。

link to StackOverflow可能会在浏览器中显示为已访问,但link to Voice of JIHAD可能会显示不同的颜色(除非您是塔利班的成员)。单击未访问的链接将其颜色更改为访问颜色 - 如StackOverflow样式表中所定义 - 并且只要该页面存在于浏览器的历史记录中,它将保持“已访问”。

答案 1 :(得分:2)

好的,现在您知道:visited可以使用浏览器历史记录,我认为您只想更改所点击链接的颜色。 我把一些jQuery放在一起

$('a').click(function(){
      $(this).addClass("visited");
});

和CSS

a{
color:#000;
text-decoration:none;
}

a.visited{
color:#205081;
}

<强>更新

  ....
  ....
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>// import jQuery
  <script>
  enter the script here..
  </script>
  </body>

这是fiddle

相关问题