Javascript 铬“；背景：0“；document.styleSheets中的cssText错误

我开发了一个Chrome扩展，将所有CSS样式应用于元素的“样式”属性（用于电子邮件等）。我在Chrome中发现了一个奇怪的行为，即css样式：

button{
    background: 0;
}

在document.styleSheets中，当我阅读此规则的cssText时，我得到：

button { background-position: 0px 50%; background-repeat: initial initial; }

但这是错误的，因为我没有覆盖背景颜色或背景图像属性。 奇怪的是，在应用background:0之后，按钮的背景实际上是“none”，只在cssText中发出

在Firefox中，我得到：

button { background: none repeat scroll 0px center transparent; }

没关系

JS Fidle演示（在Chrome中打开）：

---

是Chrome bug还是其他原因？

通过设置“背景：0；”您为按钮元素指定了一个不正确的值。Chrome必须以不同于其他浏览器的方式解释该不正确的值。将“background:0；”更改为“background:none；”，这样就可以了。

不，这不是错误，返回的值也没有错。这就是Chrome试图修复无效CSS的方式。Firefox似乎更聪明，IE在CSS面前完全不用手，它返回

按钮{background:0px；}

实际上，这个问题很简单，浏览器如何处理无效代码没有标准。他们可以尝试按照自己的意愿修复代码，甚至可以忽略它

解决方法是在规则中使用适当的值：

button {
    background: none;
}

---

验证CSS时会发现此错误。但如果chrome将此样式识别为：背景位置：0px 50%；背景重复：初始；为什么它会像样式backound image:none或背景颜色：none那样重置背景？我不知道，就像我在回答中所说的，浏览器可以根据需要处理无效的CSS。没有规则，Chrome只是选择了这样做。不过我有一个评论，我在评论中说，您正在覆盖上述属性，因为

background

只是元素背景的所有属性的快捷方式。。。