Question

我有以下css：

body {
     background-image: url(images/background.jpg);
     background-repeat: repeat-x;
     background-color: #99ccff;
}

不幸的是，在此页面上创建的任何div现在都自动拥有此颜色。如果应用于页面上的任何div，则以下都不起作用（它仍然采用上述颜色。

bacgkround: none;
background: transparent;
bacgkround-color: none;
background-color: transparent;

有人知道怎么解决这个问题（在IE中）？即如何使div透明或没有背景颜色？

编辑：我在这里上传了一个截图：http://www.namhost.com/bgtrans.jpg 基本上，背景是渐变图像，从深蓝色变为浅蓝色，即背景。在firefox中，说bradd pitt的区域是透明的，你看不到蓝色轮廓。但是，在IE中，您会看到屏幕截图中显示的内容。

以下是Firefox中可以看到的屏幕截图：http://www.namhost.com/bgtransfirefox.jpg

Answer 1

不确定这里出了什么问题（如果一切都出错了），透明并且没有意味着div不应该有自己的颜色，因此你会看到div通过父容器的背景....如果没有父母有颜色，那么你会看到身体/页面的背景

Answer 2

你对背景颜色的假设似乎是错误的。

使背景透明意味着您将获得底层元素的背景。在这种情况下，我认为它是你的身体元素。由于您为body标签设置了背景颜色，因此所有背景颜色透明的元素都将显示正文的背景颜色。

<强> 编辑：

在阅读上述答案的评论后，我想是否显示图像路径，图像宽度和高度是否覆盖整个身体元素。

Answer 3

如果您可以使用第三方工具，JQuery提供此功能：

http://mihaistancu.wordpress.com/2008/08/02/cross-browser-transparent-background-with-jquery-no-css-hacks-no-png-files/

Answer 4

但我认为这是应该发生的事情。

如果没有为div指定背景颜色，则可以看到正文背景颜色。

特别是，如果你说div背景是透明的。

Answer 5

不确定你的期望。我在firefox和IE中获得了这段代码的一致行为：

<html>
<style>
body
{
    background: green;
}
.a
{
    bacgkround-color: none;
}
</style>
<body>
<div class="a">hello</div>
<div>world</div>
</body>
</html>

如果这是一个更复杂的场景，你是否使用debugBar来检查应用的样式，或者至少在firefox上使用FireBug来查看实际应用的内容？

IE和透明背景

5 个答案: