Mozilla Firefox中的渐变工件

我在Mozilla Firefox 16中遇到线性渐变问题。

在屏幕上显示不好的东西是可见的（坏块在底部）。

码：

<a href="#">Button Text</a>

和CSS部分：

a {
    background: -moz-linear-gradient(center top , #88EB52, #3CA82D);
    border: 1px solid #399A29;
    border-radius: 4px 4px 4px 4px;
    color: #FFFFFF;
    display: block;
    float: left;
    font-size: 16px;
    font-weight: bold;
    line-height: 54px;
    margin-bottom: 20px;
    margin-top: 20px;
    text-align: center;
    text-decoration: none;
    width: 376px;
}

我在截图中更改了行高属性。

任何人都可以描述它是什么线，以及如何隐藏它？！

谢谢。 对不起我的英语不好。

---

测试FF16并按预期工作。 也许如果您在问题出现时提供线高度值，我们可以跟踪错误。 我怀疑这是由于宽高比，如果问题发生。

这不是一个缺陷，但为了保持一致性，尝试在渐变线上使用百分比或值：

background: -moz-linear-gradient(center top, #88EB52 0%, #223312 100%);

这里是工作小提琴：http://jsfiddle.net/FVcdu/1/

---

我也偶然发现了Firefox中这个奇怪的错误。 这花了一段时间，但我缩小了它是一个从CSS中失踪的声明。

当你进行渐变时，你应该尝试并在其中使用所有不同的浏览器标准，以便在所有浏览器中渐变看起来尽可能好。 我可以推荐使用Ultimate CSS Gradient Generator，它可以为所有浏览器提供css delcerations。

对于我而言 ，最后解决它的一个声明是W3C标准：linnear-gradient（）。

background: linear-gradient(to bottom,  #CCCCCC 0%,#EEEEEE 100%);

因此，在您的代码中添加该代码可能可以解决您的梯度底部1px行问题，就像它为我所做的一样。

终极CSS渐变发生器：http://www.colorzilla.com/gradient-editor/

链接地址: http://www.djcxy.com/p/11375.html

上一篇: gradients artifacts in Mozilla Firefox

下一篇: How to prevent a system call from being executed with ptrace