IE7 自动为内联 CSS 添加透明度答案

【问题标题】：IE7 auto-adds transparency to inline CSSIE7 自动为内联 CSS 添加透明度
【发布时间】：2011-10-01 12:44:53
【问题描述】：

我有一个透明的 PNG。 IE7，在它的所有荣耀中，采用我的内联 CSS 并对其进行修改以在其中包含“背景颜色：透明”。这是有问题的，因为 CSS 行搞砸了 PNG 图像下方的表格颜色。

这就是我告诉 IE 渲染的内容：

<td style="white-space: no-wrap; margin: 0; padding: 0; background: url('FOO.PNG') left top repeat-y;"> ... </td>

这是我在使用 IE 的开发者工具（F12）时得到的：

<td style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; background-image: url("FOO.PNG"); background-attachment: scroll; background-repeat: repeat-y; background-position-x: left; background-position-y: top; background-color: transparent;"> ... </td>

如您所见，幕后发生了一些神奇的事情。我假设 IE7 读取 png 文件并确定它具有透明度。一旦这样做，它会专门添加内联 CSS。罪魁祸首是“背景颜色：透明度”。如果我在开发者工具中禁用它，一切正常。

有人遇到过这种情况吗？

【问题讨论】：

为什么会出现这个问题？您遇到什么显示问题？我怀疑它与PNG文件有什么关系。你没有指定背景颜色，所以背景是透明的。
默认的background-color是transparent（至少规范告诉IE如何实现）。
是的，默认应该是这样。但是如果我手动指定背景颜色，它会被透明覆盖。
您是在与图像相同的行中指定颜色，还是在其他位置？
在IE添加的同一行。

标签： html css png transparency

【解决方案1】：

奇怪 - 尝试以老式方式指定背景（即不是速记）

<td style="padding: 0px;margin: 0px;background-image: url("FOO.PNG");background-repeat: repeat-y; background-position: left top;"> ... </td>

我希望 IE 在这种情况下不会添加额外的内联样式（除了拆分简写 margin 和 padding）。

必须承认我很惊讶background-color: transparent 引起了问题。另外 - 为什么是内联样式？

【讨论】：

代码不是我写的，是我继承的。我可能最终会改变它，但不会在不久的将来。
好的，很酷，你在哪里指定你真正想要的背景颜色？如果在 css 文件或样式标记中，则将 !important 添加到声明中。这将覆盖内联样式
添加 !important 到内联 CSS 有效。我尝试将它添加到我拥有的主 .CSS 文件中，但这产生了新问题并且没有解决旧问题。这有点像 hack，但我可以忍受。

【解决方案2】：

这是根据规范。

当您使用速记属性时，您未明确指定的任何值都将重置为其默认值。

如果您想获得本来会通过级联应用的值，请不要使用该属性的简写版本（使用background-image 和 background-position 和等等

【讨论】：

IE 用透明覆盖我的背景颜色更改。