镀铬径向css渐变光滑度

Question

我正在使用chrome 18.0.1025.162并尝试做径向渐变

-webkit-radial-gradient(circle, rgba(100, 100, 100, 0.2), rgba(0, 0, 0, 0.9))

问题是渐变是非常像素化的,颜色和alpha的过渡是块状而不是平滑的.这在Safari和Firefox中有所不同.Safari和Firefox做得非常顺利

这是铬的错误吗？任何人都有同样的问题.它如此简单的渐变!! 当然,像这样简单的事情不会是一个小问题

查看:http://jsfiddle.net/GyRLe/1/,了解我的意思.

这有解决方案吗？图像会很糟糕:(

(好的,看看平滑度有多糟糕):这就是我使用它时得到的结果:http: //i.imgur.com/UYB1d.png(Chrome)
http://i.imgur.com/tzGuq. png(Safari)(看起来有点前卫,但那是因为png,否则它接近完美的平滑度)

Firefox和Safari一样好,只是chrome正在做得很糟糕我需要alpha,因为我在后台放了一个重复的样式图像

编辑:Chrome 20(金丝雀)也有这个可怕的问题!

Edit2:我们使用CSS的原因是我们不必使用图像!所以我已将此添加到http://code.google.com/p/chromium/issues/detail?id=123491并希望谷歌得到他们的行为直接,因为我认为铬是美妙的

Answer 1

我知道它很久以前就已经发布了，但我在 Chrome 24 上遇到了同样的问题（强条带），使用：

-webkit-radial-gradient(center, ellipse cover,  #XXXXXX 0%,#YYYYYY 100%);

但我意识到使用下面的代码，条带几乎消失了：

-webkit-gradient(radial, center, 0px, center, 100%, color-stop(0%,#XXXXXX), color-stop(100%,#YYYYYY));

希望这可以帮助。

编辑：我已经看到 -webkit-gradient(radial, ...) 只是径向渐变显示的旧语法，所以它不应该是该问题的长期答案......