请帮忙！CSS3发光的过渡问题

Question

我正努力学习本教程，因为我非常喜欢它的效果。

CSS文本光晕悬停与过渡效果

但问题是，我将背景颜色设置为白色。

<style>
.text-glow-hover-with-delay{
background: #FFFFFF;
color: #fff;
transition: text-shadow 3s;
-moz-transition: text-shadow 3s; /* Firefox 4 */
-webkit-transition: text-shadow 3s; /* Safari and Chrome */
-o-transition: text-shadow 3s; /* Opera */
}
.text-glow-hover-with-delay:hover{
text-shadow: 0 0 10px #fff;
}
</style>
<div class="text-glow-hover-with-delay">
Put your mouse over me and I will glow slowly.
</div>

现在它不再发光了。我对CSS一无所知（

Answer 1

可能是因为阴影是白色的，所以您看不到它。但是，它工作得很顺利。只要减少时间，3秒就太多了。

这是正在运行的DEMO

或者，如果您只想要一个白色阴影请参阅此处

Answer 2

我删除了过渡CSS，因为它似乎把它搞砸了，我把颜色改成了黑色：

http://jsfiddle.net/Ce5SB/

Answer 3

对于css转换，必须从点A到点B。

这意味着点A应该在默认类上有一个默认的文本阴影。

 .text-glow-hover-with-delay{
      text-shadow:0 0 0 #fff;/*This is the missing piece*/
      ....
 }

有了上面缺失的部分，点B将知道从哪里过渡。

如果以上不起作用，也请告诉我。您可能还想尝试转换为

 transition:all 300ms ease;/*just in case each browser wants to capture its browser specific text shadow property*/