Question

html 点击连接后变色

如图，这个文章链接表每个页面的都。每个连接对应一个文章，连接都是红色的，比如我点击“文章2”后，到《文章2》的页面，相应的“文章2”连接变黑色。然后我再点“文章3”连接后转到《文章3》的页面，相应的“文章3”连接也就变黑色，但是“文章2”连接又变回红色。
怎么弄，html和css 解决，不要JS。
我查了w3school，好像几个伪类都不能解决这个问题。
好像a:active能解决，但是w3school并没有写

Answer 1

一、创建一个新的HTML文件。

二、在HTML文件中找到body标记，在标记中创建一个div标记，并将类设置为BG。

三、在title标记之后创建一个样式标记，以将样式添加到BG类。为BG类设置宽度、高度和背景色。

四、将背景颜色设置为在鼠标移动到Div上时更改。添加鼠标悬停：将鼠标悬停到BG样式类，然后在鼠标悬停时设置背景颜色。

五、实用程序浏览器打开。保存HTML并用浏览器打开它。当鼠标不在Div上移动时，背景是红色的。当鼠标在Div上移动时，背景从红色变为棕色。

六、所有代码都可以直接复制到新主页的HTML文件中。保存后，可以使用浏览器打开它以查看效果。

Answer 2

可以利用CSS的伪类实现：

a:link，定义正常链接的样式； 
a:visited，定义已访问过链接的样式； 
a:hover，定义鼠标悬浮在链接上时的样式； 
a:active，定义鼠标点击链接时的样式。 

例子：

<style>
a:link { 
color:#FF0000; 
text-decoration:underline; 
} 
a:visited { 
color:#00FF00; 
text-decoration:none; 
} 
a:hover { 
color:#000000; 
text-decoration:none; 
} 
a:active { 
color:#FFFFFF; 
text-decoration:none; 
} 
</style>
<a href="http://baidu.com" target='_blank'>我是a标签</a>

例子说明：定义的链接颜色是红色，访问过后的链接是绿色，鼠标悬浮在链接上时是黑色，点击时的颜色是白色。 

Answer 3

如果每个页面都有这些链接，那么就给要点击的链接一个class="select",例如如果页面在文章2，那么《文章2》的页面上的 文章2这个链接的CSS属性为.select｛color: black｝,

一次类推，页面n ，就在页面n的链接给class="select"。
你这种情况用a:visited是解决不了的

Answer 4

当前在哪个文章页面，比如现在在文章2页面，你在样式里把文章2链接的颜色写的跟其他不一样就行了，可以把这个a标签（当前文章）设个单独的类名，伪类说到的变化是在当前页面里的。

追问

我是在用wordpress在做模板，链接都是调用的函数，这样能实现吗

Answer 5

你只要给那个a标签写css就好
<style type="text/css">

a{
color:red;
}

a:active{
color:black;
}

</style>

追问

不对，a:active{color:black;} 这个是在鼠标点击的瞬间链接变黑，希望你仔细看下我的问题

追答

好的，那如果你想让鼠标移上去就编程黑色，可以使用以下代码：

a{
color:red;
}

/**鼠标移上去后变成黑色**/
a:hover{
color:black;
}

/**鼠标点击后变成黑色**/
a:visited{
color:black;
}

/**鼠标点击下去变成黑色**/
a:active{
color:black;
}

你可以自由搭配