CSS3渐变，透明度无法在Safari中正确显示

Question

这是一个难题。以下渐变无法在Safari中正确显示（适用于Firefox和Chrome）：

background: linear-gradient(transparent 124px, #de6230);

我也尝试过：

background: linear-gradient(rgba(255,0,0,0) 124px, #de6230);

在Safari上测试它，您将看到问题：jsFiddle。

我该如何解决这个问题？

Answer 1

尝试：     背景：线性渐变（rgba（255,255,255,0）124px，＃de6230）;

编辑：抱歉OP，虽然它是正确的颜色，但仍然看起来与渐变看起来不一样，灰色的中间只是转向白色的中间。我找到的解决方案是：

background: linear-gradient(rgba(222,98,48,0) 124px, #de6230);

222,98,48是＃de6230的rgb值，所以这应该有效。它正在从0％alpha的颜色转换为100％alpha的颜色。

Answer 2

尝试：

background: -webkit-linear-gradient(rgba(255,0,0,0) 124px, #de6230);
background: -moz-linear-gradient(rgba(255,0,0,0) 124px, #de6230);
background: -o-linear-gradient(rgba(255,0,0,0) 124px, #de6230);
background: linear-gradient(rgba(255,0,0,0) 124px, #de6230);

或用 background-image

替换背景

background-image: -webkit-linear-gradient(rgba(255,0,0,0) 124px, #de6230);
background-image: -moz-linear-gradient(rgba(255,0,0,0) 124px, #de6230);
background-image: -o-linear-gradient(rgba(255,0,0,0) 124px, #de6230);
background-image: linear-gradient(rgba(255,0,0,0) 124px, #de6230);