2

我有一个按钮，它在 Firefox 中呈现怪异（我正在测试各种版本，但我在所有版本中都看到了它）。有关更多详细信息，我使用 Normalize.css。

经过多次测试，出现问题的 PC 与行为正确的 PC 之间的唯一区别是显卡。

此外，问题因您看到的页面而异（按钮位于不同的页面中）。

在这里，您可以看到不同 PC 中的一些屏幕截图： 在此处输入图像描述

我在 jsFiddle中做了一个测试用例：http : //jsfiddle.net/5R2NL/1/

这是HTML：

<div class="botonVerdeenlace">
    <a title="Title" href="#">I feel like a button</a>
</div>

以及相关的 CSS：

body{font-size:68.75%}

.botonVerdeenlace {
    background: url("http://i.imgur.com/lk4ZJxQ.png") no-repeat scroll left center rgba(0, 0, 0, 0);
    display: inline-block;
    font-weight: normal;
    margin: 0;
    padding: 8px 2px 7px 29px;
}


.botonVerdeenlace a, .botonVerdeenlace a:visited {
    background: url("http://i.imgur.com/2IgIR37.png") no-repeat scroll right center rgba(0, 0, 0, 0);
    border: medium none;
    color: #FFFFFF !important;
    font-family: Arial,sans-serif;
    font-size: 1.1em;
    font-weight: normal;
    margin: 0;
    padding: 8px 1em 7px 7px;
    text-align: center;
    text-decoration: none;
}
  • 是什么导致了这个问题？肯定是显卡？
  • 有没有办法在不为其他用户设计的情况下解决这个问题？

编辑：我尝试了 Nico O 的建议，硬件加速似乎对渲染没有任何影响。

EDIT2：使用 css3 不是一个选项，因为网络上有很多按钮。如果这是唯一的解决方案，客户宁愿让它“坏”。

4

1 回答 1

0

可能是“硬件加速（GPU 渲染）”故障。您可以在选项上禁用此功能并再次测试，但最好使用 CSS3。

但是我的客户想要 IE7：在 CSS 上声明您在 IE7 上工作的普通按钮，而不是使用您的 CSS3 按钮进行适用于任何分辨率的媒体查询，这样按钮在 IE7 上仍然很好，并且在 Firefox 上工作得很好。

于 2014-02-21T11:43:34.700 回答