css - 可以为 box-shadow CSS 属性设置动画吗？Chrome 有动画，Firefox 没有

Question

下面是 jsfiddle.net 示例：

http://jsfiddle.net/PGa2H/

CSS

@keyframes blink {
    0% { box-shadow: 0 0 15px green; }
    50% { box-shadow: 0 0 0; }
    100% { box-shadow: 0 0 15px green; }
}

@-webkit-keyframes blink {
    0% { box-shadow: 0 0 15px green; }
    50% { box-shadow: 0 0 0; }
    100% { box-shadow: 0 0 15px green; }
}

.blink {
    -webkit-animation: blink 1.0s linear infinite;
    animation: blink 1.0s linear infinite;
}

• 盒子阴影动画在 Chrome 中工作

• 在 Firefox 中不起作用

问题

• 哪些 CSS3 属性可以设置动画？

• 这是在哪里指定的？

• 如果 Firefox 有问题，是否有参考

Answer 1

box-shadow如果您出于某种原因使用无效值，Firefox 似乎不喜欢它。如果要取消阴影使用box-shadow: none。这似乎就是工作所需要的一切。

http://jsfiddle.net/PGa2H/2/

这似乎是一个非官方但准确的动画属性列表：http: //oli.jp/2010/css-animatable-properties/