html - Mozilla Firefox 中的线性渐变工件

标签 html firefox css linear-gradients

我在 Mozilla Firefox 16 中遇到线性渐变问题。 firefox linear-gradient artifact

在屏幕上可以看到不好的东西(坏的 - block 底部的灯线)。

代码:

<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%);

这是工作 fiddle :http://jsfiddle.net/FVcdu/1/

关于html - Mozilla Firefox 中的线性渐变工件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13172500/

相关文章:

javascript - 如何在 jQuery mouseout 上应用原始样式

javascript - 在 Twitter Bootstrap 中的网格跨度之间创建空间

css - 如何在 Firefox 4 + 中重置默认按钮样式

javascript - Firefox 中文本框的 onpropertychange?

带箭头的 CSS slider 使用动画

javascript - 如何将视频放入 Canvas ?

javascript - AngularJS 在 Html Table 上观看

css - FontAwesome Firefox 某些字体存在问题

javascript - 如何设置:before psudo property for a group of css styles

css - Bootstrap 内联表单不显示内联