编辑文本输入字段的背景颜色而不更改其默认浏览器样式

Question

我有一些想法，涉及更改我的一些文本输入字段的background-color。我继续看看他们是否看起来像我希望的那样，这就是我所看到的：

第一个是真正简单的，第二个是CSS样式background-color: #FFFFFF;，最后一个有background-color: #FEFEFE;，你可以在那里体验：JSFiddle

一旦我更改了这个样式属性，似乎浏览器就会忽略输入元素的所有预设样式。 Internet Explorer 11甚至放弃了蓝色光晕，这通常在文本输入字段悬停时出现（也应该处于模糊状态）。

我是否可以仅改变背景颜色而不会造成所有这些？

无论如何，我可能会对文本输入字段进行彻底的设计，我是出于好奇而提出的。

Answer 1

我做了一些关于这方面的研究，它让我想知道它的真实行为是什么，不幸的是，我无法找到任何解释，所以我只能假设，一旦你设定输入，它的外观，重置为默认值，忽略浏览器为元素提供的本机样式。

我想你可能已经知道了，因为你的最后评论，但为了以防万一，这将有助于你保持输入的模糊效果，同时，它将使它们以相同的方式呈现不同的浏览器，你也可以添加高度，以保持更加一致。

input
{
    border:solid 1px #CCC;
    background-color:#FFFFFF;
}
input:focus
{
    box-shadow:0 0 3px 0 blue;
    outline:none;
    border:solid 1px #CCC;
}

我希望这有帮助！