Question

我在Firefox 49.0（在Linux Mint下）测试以下代码：

＆＃13;

a{
  font-size:50px;
  color:gray;
  font-weight:1000;
  transition:color 1s;
}
a:hover{
  color:black;
}
a:visited{
  color:lightgray;
}

＆＃13;

<a href="">VISITED LINK</a><br>
<a href="https://google.com/randomtext">LNK NOT VISITED</a>

＆＃13;

Here is a codepen如果您更喜欢这样的话。如果代码不清楚：我希望链接在访问时是恒定的lightgray，在没有访问时是灰色的，在悬停未访问的链接时是黑色的。另外，我想在这些颜色之间转换。

但是，firefox似乎首先将hover规则应用于被访问链接，然后是：visited规则，并且还在这些之间进行转换，从而闪烁。

我似乎无法找到解决方法。

修改：Chrome会按照我想要的方式显示它。

Answer 1

这似乎是一个Firefox错误，转换未正确处理。

Answer 2

我找到了解决方法： 您需要将悬停状态添加到访问状态。请参阅下面的代码。

a {
	text-decoration: none;
	color: #000000;
	transition: .3s color;
}

a:hover, a:visited:hover {
	color: #9097a0;
}

<a href="https://stackoverflow.com/" target="_blank">Demo Link</a>