[英]Firefox linear-gradient issue
I've got a gradient div, here it is: 我有一个渐变div,这里是:
<div class="gradient"></div>
And here is css: 这是css:
.gradient {
width: 20px;
height: 20px;
background: linear-gradient(to right, rgba(0,0,0,0) 0%, #fff 100%)
}
Very simple. 非常简单。 In Chrome it's works fine, but in Firefox (34.0, Ubuntu 14.04) it's work not correctly: 在Chrome中,它运行良好,但在Firefox(34.0,Ubuntu 14.04)中,它的工作不正确:
I tried use rgba(0,0,0,0)
instead transparent
, tried -moz-linear-gradient
prefix — no results. 我尝试使用rgba(0,0,0,0)
代替transparent
,尝试过-moz-linear-gradient
前缀 - 没有结果。
Thanks! 谢谢!
If you want to avoid the grey in the middle you can use a gradient from transparent white (255, 255, 255, 0)
to opaque white (255, 255, 255, 1),#fff
. 如果你想避免中间的灰色,你可以使用从透明白色(255, 255, 255, 0)
到不透明白色(255, 255, 255, 1),#fff
。
.gradient {
width: 20px;
height: 20px;
background: linear-gradient(to right, rgba(255,255,255,0) 0%, #fff 100%)
}
http://dabblet.com/gist/64dd43f37e8978d08749 http://dabblet.com/gist/64dd43f37e8978d08749
In your code the gradient goes from transparent black to opaque white and because of that the grey part in the middle shows up in FF. 在你的代码中,渐变从透明的黑色变为不透明的白色,因此中间的灰色部分显示在FF中。
I guess chrome and other browser calculate the color steps in the gradient differently. 我猜chrome和其他浏览器以不同的方式计算渐变中的颜色步长。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.