我也遇到过这种情况，我不知道为什么会这样，但我在自己的项目中使用了以下方法：

background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.001) 0%, #fff 5%, #fff 100%);

不要给Chrome一个“透明”的值，而是给予它一个非常非常接近透明的值。
编辑：我忘了发布一个链接到我自己的version，它在Chrome 21（Windows 7）中的渲染效果和预期的一样。

我粘贴在这里的CSS是错误的，我编辑了错误的文件DOH！

原始CSS不工作

background-image: linear-gradient(top, transparent 0%, #fff 5%, #fff 100%);
background-image: -o-linear-gradient(top, transparent 0%, #fff 5%, #fff 100%);
background-image: -moz-linear-gradient(top, transparent 0%, #fff 5%, #fff 100%);
background-image: -webkit-linear-gradient(top, transparent 0%, #fff 5%, #fff 100%);
background-image: -ms-linear-gradient(top, transparent 0%, #fff 5%, #fff 100%);

修复问题的CSS

background-image: linear-gradient(top, rgba(255,255,255,0) 0%, #fff 5%, #fff 100%);
background-image: -o-linear-gradient(top, rgba(255,255,255,0) 0%, #fff 5%, #fff 100%);
background-image: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, #fff 5%, #fff 100%);
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, #fff 5%, #fff 100%);
background-image: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, #fff 5%, #fff 100%);

透明的问题不在于颜色，而在于阿尔法值为0的黑色，设置为阿尔法值为0的白色可以解决这个问题。
这仍然与浏览器供应商处理CSS3渐变中alpha透明度的方式不一致。

使用白色以外的颜色（实际上是白色）的技巧是**rgba正在褪色的实际颜色**。

background-image: linear-gradient(to right, 
  rgba(111,174,249, 0) 0%,
  rgba(111,174,249, 0) 80%,
  rgb (111,174,249)    100%);

• 如果使用的颜色是十六进制（如#6faef9），请使用a hex to rgba converter转换颜色。*

在本机IOS上也会遇到同样的问题：

1. iOS White to Transparent Gradient Layer is Gray
2. https://betterprogramming.pub/the-proper-way-of-creating-a-transparent-gradient-layer-in-ios-b082daa866b1layer-is-gray
   我注意到CSS的解决方案是使用白色而不是黑色，然后添加0透明度

rgb(255 255 255/0)

我最近也遇到了同样的问题，关于safari的透明度，对我有效的方法是把css替换成编译好的safari css。
这对我没用

background-image: linear-gradient(to top, rgba(56,56,56,1) 5%, rgba(255,255,255,0.001) 100%)

这对我确实有效

background-image: linear-gradient(0deg,#383838 5%, hsla(0, 0%, 20%, 0) 100%)