html - 如何一次使CSS过渡循环？

我试图使一些文字淡入一种新的颜色，然后再回到原来的颜色。

#sidebar2:target .phonenumber {
    -o-transition:0.7s;
    -ms-transition:0.7s;
    -moz-transition:0.7s;
    -webkit-transition:0.7s;
    transition:0.7s;
    color: yellow;
}

目前它只是去新的颜色，并保持这样。我怎样才能修改这段代码，使之符合我的要求？感谢您的帮助！
编辑：
我正在使用：target，这样当用户单击同一个页面链接时，我链接到的文本部分将突出显示。我希望文本淡入不同的颜色，然后再返回

最佳答案

我非常确定不可能循环转换，您可以从一个状态转换到另一个状态，但不能在一个转换中再次返回。
为了达到你想要的效果，你可以用动画代替。
首先设置动画关键帧：

@keyframes glowyellow {
  0% { color: auto; }
  50% { color: yellow; }
  100% { color: auto; }
}

然后在元素上使用这个：

#sidebar2:target .phonenumber {
  animation: glowyellow 1.4s linear;
}

使用供应商前缀来支持浏览器，就像您在示例中所做的那样。
这是一个fiddle as an example。

关于html - 如何一次使CSS过渡循环？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/16299535/