Safari 6渐变色彩混合/插值错误
图片应该解释一切。 左边是Safari 6,右边是Chrome。 透明红色渐变的下半部分不仅完全错误(这可能是过热的预乘α的情况),上半部分也较暗,看起来像伽马正确性问题。
这个问题出现在Mountain Lion和iOS6 Mobile Safari上的Safari 6上,但不在Lion上的Safari 6上。
http://jsfiddle.net/ZUTYm/4
有没有人找到获得预期结果的解决方案? 我需要我的渐变涉及到alpha,因为我试图淡入淡出文本。
由于我无法完成我的编辑,直到我输入实际代码,这里是渐变定义: background-image: -webkit-linear-gradient(top, red, rgba(255,128,128,0), white);
我能够在Mac 10.8.1 Safari 6.0(8536.25)和iOS Safari 6.0.1上重现此问题。 我认为应用-webkit-mask-image
而不是透明的color-stop可以避免这个问题:
.grad-bg {
background-image:
-webkit-linear-gradient(top, #ff0000, #fff);
height: 100%;
}
.masked {
-webkit-mask-image:
-webkit-linear-gradient(top, white, transparent, white);
}
的jsfiddle
在图像中,顶部显示在白色背景上,底部形状显示在相同颜色的不透明渐变背景上。
(许多编辑。)
链接地址: http://www.djcxy.com/p/66677.html上一篇: Safari 6 Gradient color blending/interpolation bug
下一篇: how to send notifications from a website to an android app