html - 如何使访问过的链接不被访问？

Question

访问过的链接没有更改为它们应该更改的颜色时出现问题。应该下降的是，链接是黑色的，不透明度为 70%。当你将鼠标悬停在它上面时，它应该变成不透明度为 100% 的 aliceblue。这仅适用于未访问的链接。被访问的链接应该和正常的链接完全一样，除了它们没有正确改变这一事实。

a{
transition: color 1s ease;
}

a:link {
display: inline-block;
margin-left: 20px;
color: rgba(0,0,0,0.7);
font-weight: 700;
font-size: 14px;
text-decoration: none;
font-family: arial;
text-transform: uppercase;
}

a:hover{
color: aliceblue;
text-decoration: none;
font-family: arial;
text-transform: uppercase;
}

a:visited{
transition: color 1s ease;
display: inline-block;
color: rgba(0,0,0,0.7);
margin-left: 20px;
font-weight: 700;
font-size: 14px;
text-decoration: none;
font-family: arial;
text-transform: uppercase;
}

Answer 1

这是 CSS 中级联样式的问题，如下所述:

https://stackoverflow.com/a/1536822/3990818

a:hover must be placed after the a:link and a:visited rules

除非这样做，否则 a:visited 将覆盖 a:hover。

您也可以在 http://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_link_more1 进行试验通过重新排列不同的 CSS 规则，作为这个问题的简单测试平台。