如何在css中制作具有透明度的径向渐变

Question

我想制作透明度变化的径向渐变，我可以让它线性工作但不是径向

background: -webkit-gradient(linear, left top, left bottom,from(rgba(50,50,50,0.8)), to(rgba(80,80,80,0.2)));

此代码线性工作，但更改为

background: -webkit-gradient(radial, from(rgba(50,50,50,0.8)), to(rgba(80,80,80,0.2)));

停止工作

我需要做些什么来改变这一点，到目前为止所有的帮助只显示线性渐变

Answer 1

radial-gradient的语法错误。

你需要写这样的东西： background-image: radial-gradient(ellipse farthest-corner at 45px 45px, rgba(50, 50, 50, 0.8) 0%, rgba(80, 80, 80, 0.2) );

查看MDN docs了解更多详情。

Answer 2

angrytools.com有一个很好的在线工具可以帮助您创建具有透明度的径向渐变。它将为您为不同的浏览器生成CSS。