Question

（适用于支持CSS过渡的浏览器，包括最新版本的Firefox，Safari和Chrome。奇怪的是，这个问题不会出现在Opera中。）

有没有人注意到这个？当您在：链接上放置颜色过渡时，a：visited会在显示a：hover颜色之前转换为a：link颜色。看看：

http://jsfiddle.net/Mgzv9/2/

可以避免这种颜色闪烁吗？

Answer 1

我一直在解决这个问题。

问题是，这个问题实际上难以重现。

好的，所以会发生什么，有时加载/刷新链接上有颜色过渡的页面时，颜色首先从默认的浏览器链接颜色转换为CSS定义的颜色。当我从磁盘打开HTML时，实际上并没有发生这种情况，但如果我把它放在服务器（甚至是本地服务器）中，那么就会出现这个问题。

要重现问题，请创建HTML，添加样式表并定义链接转换，如下所示：

a {
  color: red;
    -webkit-transition: color .5s linear;
    -moz-transition: color .5s linear;
    -o-transition: color .5s linear;
    -ms-transition: color .5s linear;
    transition: color .5s linear;
}

a:hover {
  color: green;
}

...然后在HTML中包含样式表。

将文件放在服务器上，尝试在Chrome中打开该页面，尝试刷新网站，有时您应首先看到页面加载时默认蓝色的转换。

解构了一些网站后，似乎没有问题，我提出了这个简单的解决方案。

如果您也包含一些Javascript文件，那么只需将您的CSS包含在 AFTER 中，即可。

如果你只是在样式表之后包含一个空的JS文件，它甚至可以工作。

希望这有帮助！

Answer 2

我在使用颜色时从未见过它。但是在使用baground中的图像时会发生这种情况。这是加载时间的bcoz，可以通过在一个大图像中使用所有过渡图像并使用baground-position属性来控制图像来避免。

CSS转换闪烁着：在Safari，Chrome和Firefox中访问过，但不是Opera

2 个答案: