Question

我观察到一个非常奇怪的问题，这个问题我无法完全掌握。因此，当我用jQuery更改其背景颜色时，我想请大家解释一下我在按钮上放弃默认CSS的情况？

这是demonstrated in the jsfiddle（在FF和Chrome上测试过）。如果你将鼠标悬停在按钮上，它将失去其风格，例如没有圆形边框，这不是人们期望发生的。 你能解释一下为什么会这样吗？另外，您建议保留默认的“CSS”设置？

Answer 1

如果您在css中设置按钮的背景颜色，那么请将其设置为jQuery中的那种颜色，然后再进行操作。

http://jsfiddle.net/899Wn/8/

button {
    background: blue;
}


$("#nav ul li button").hover(function() {
    $(this).stop().animate({
        backgroundColor: '#E5E5E5'
    }, 500);
}, function() {
    $(this).stop().animate({
        backgroundColor: 'blue'
    }, 500);
})

Answer 2

您很快就会开始设计表单元素，即。 a＆lt; button href =“＃”＆gt;标记，特别是背景颜色或边框，浏览器重新渲染元素。然后，它显示您的特定.css并且您松开'浏览器+软件+ o.s。'具体的造型。

styling form controls introduction和styling form controls in details

Answer 3

我认为页面上的默认按钮是系统生成的按钮（即Windows）。更改任何视觉上影响的样式将导致您的浏览器呈现按钮，删除某些样式。一旦你到了这里，现在又回来了。最好的做法是将样式按钮看起来非常相似，然后您可以修改单个样式而不会丢失其余样式。类似的答案：Chrome default button style。我会看看能不能找到更多有关此事的信息。

修改

此页面上的第二个答案似乎支持了我的想法，但仍然没有参考：https://stackoverflow.com/a/10265336/719718

更改按钮的背景颜色时，为什么默认CSS会丢失？

3 个答案: