CSS过渡不适用于访问的链接答案

【问题标题】：CSS transition not working on visited linksCSS过渡不适用于访问的链接
【发布时间】：2012-02-03 19:16:34
【问题描述】：

我正在尝试在超链接上实现 CSS 转换，我正在尝试遵循代码，但它仅适用于未访问的链接。它不适用于访问的链接。我做错什么了吗？

a, a:link, a:visited {
    color: lightblue;
    -webkit-transition: color .4s linear;
    -moz-transition: color .4s linear;
    -o-transition: color .4s linear;
    -ms-transition: color .4s linear;
    transition: color .4s linear;
    }

    a:hover {
        color: red;
    }

没有任何其他 CSS 代码可以与之冲突。

【问题讨论】：

标签： css css-transitions

【解决方案1】：

CSS 伪类必须一个接一个地出现才能工作：

a { /* code */ }
a:link { /* code */ }
a:visited  { /* code */ }
a:hover { /* code */ }

还要注意，这些是书面的顺序。

【讨论】：

如果您的 :link 和 :visited 伪元素相同（如您上面的情况），它们可能也没有必要。我只是回到a{ /*code*/ } 来获取第一条规则并完成它 - 测试一下，看看你是否发现任何差异。

【解决方案2】：

它不适合您的原因很可能是您正在测试 Chrome 中的功能。看看这个链接：

CSS3 color transition not working in Chrome

【讨论】：