IE 无法显示 html 背景图片（颜色没问题）答案

【问题标题】：IE fails to show html background image (colour is ok)IE 无法显示 html 背景图片（颜色没问题）
【发布时间】：2012-05-07 12:45:31
【问题描述】：

所以 Chrome 和 FF 都可以，只是 IE9 无法显示 html 背景 - 它显示其颜色，但没有图像。我怎样才能让它正常工作？

测试它：here

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
html {
    width:100%;
    height:100%;
    background-color: #ffeacd;
    background-image: url(bg.png);
    background-position: 0px 0px;
    background-repeat: repeat-x;
    margin: 0px;
    padding: 0px;
}
body {
    background-position: center top;
    width:100%;
    height:100%;
    margin: 0px;
    padding: 0px;
    background-image: url(bg_overlay.png);
    background-repeat: no-repeat;
}
.content {
    width:1020px;
    height: 100%;
    padding: 0px;
    margin-top: 0px;
    margin-right: auto;
    margin-bottom: 0px;
    margin-left: auto;
}
</style>
</head>
<body>
<div class="content"></div>
</body>
</html>

【问题讨论】：

在 IE9 和 IE8 中测试 - 图像在那里。然而它是巨大的，你必须等待它被下载。您必须将其重新保存为网络优化版本
对您的页面进行一些研究，似乎如果我禁用正文的背景图像，它将显示 HTML 的背景图像，这就是我到目前为止收集的内容......
如果这有帮助，这个人在上一个问题上通过更改文档类型找到了解决方法。我无法自己测试，但您应该尝试一下：stackoverflow.com/a/6834087/874533

标签： html css

【解决方案1】：

似乎 IE 不允许在 html 元素上使用背景图像标记。尝试做这样的事情。

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body {
width:100%;
height:100%;
background-color: #ffeacd;
background-image: url(header-ad.png);
background-position: 0px 0px;
background-repeat: repeat-x;
margin: 0px;
padding: 0px;
}
#wrapper {
background-position: center top;
width:100%;
height:100%;
margin: 0px;
padding: 0px;
background-image: url(hdr_GSA_lp.jpg);
background-repeat: no-repeat;
}
.content {
width:1020px;
height: 100%;
padding: 0px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="content">

</div>
</div>
</body>

【讨论】：