是否可以在 CSS3 中为渐变不透明度设置动画？ [复制]

【问题标题】：Is it possible to animate gradient opacity in CSS3? [duplicate]是否可以在 CSS3 中为渐变不透明度设置动画？ [复制]
【发布时间】：2012-03-03 00:43:44
【问题描述】：

可能重复：
CSS3 animation with gradients

我有一个径向渐变的元素，代码如下：

background: radial-gradient(center, ellipse cover,  rgba(255,255,255,0.65) 0%,rgba(255,255,255,0) 100%);

我想实现从不可见到可见的过渡，我相信这可以通过更改第一个 rgba 值的 alpha 值来实现。我只是不知道语法应该是什么样子。或者这在 CSS3 中是否可行？

【问题讨论】：

【解决方案1】：

渐变色尚不能在任何浏览器中设置动画/可转换，尽管规范规定它们应该是。

要获得这种效果，您需要添加一个从 0 转换为 1 的单独“不透明度”属性。

【讨论】：

感谢您的回答 :-) 我将渐变放在 :before 伪元素中，然后按照您所说的更改它的不透明度。它在 FireFox 中运行，但由于某种原因没有在 Chrome 中运行。不知道这是因为它是一个伪元素还是什么——但那完全是另一个问题，有时间我将不得不看一下。
有一大堆关于伪元素的错误。似乎有一堆 CSS 效果不能与它们一起正常工作。我建议将过渡放在父元素上，而不是直接放在伪元素上（或将伪元素包装在 div 或 span 中并进行过渡）
谢谢你的建议，我去试试。