页眉和页脚背景图像不会在 IE8 中显示答案

【问题标题】：Header and Footer background images won't show in IE8页眉和页脚背景图像不会在 IE8 中显示
【发布时间】：2012-01-14 00:16:18
【问题描述】：

好吧，这让我发疯了。在 IE8 中，背景渐变图像不会显示在页眉或页脚中，但其他背景图像会显示。我在 IE9、Firefox、Chrome、Safari 或 Opera 中没有问题。我已经在这里和其他地方寻找建议的解决方案，但到目前为止都没有奏效。使用 HTML5 和 CSS3，我知道这在旧浏览器中有时很时髦。

这是页脚的代码：

footer {
text-align:center;
color:#f9f2e7;
font-size:14px; 
display:block;
background: #26b6c9;
background-image:url(images/bg-footer.png);
background-repeat:repeat-x;
background-attachment:scroll;
position:relative;
height:103px;
clear:both;
width:100%;
float:left;
}

这是标题：

header {
background: #26b6c9;
background-image:url(images/bg-header.png);
background-repeat:repeat-x;
background-attachment:scroll;
margin: 0 auto;
position:relative;
height:159px;
width:100%;
float:left;
}

我尝试过 display:block 和 shorhand 代码，例如 background: url(images/bg-footer.png) repeat-x top left scroll;但两者都不起作用。

本站的测试区可以找到here。当我注意到这个问题时，我正在开始将其转换为 WordPress 模板，因此 CSS 可能仍然有点混乱。

【问题讨论】：

查看本教程net.tutsplus.com/tutorials/html-css-techniques/…
你检查IE8是否支持你想要的HTML5的功能？

标签： html css internet-explorer-8

【解决方案1】：

这是因为您使用的是 html5 - ie8 和更早版本不支持它。

试试modernizr 或html5 shiv

【讨论】：

【解决方案2】：

IE 8 及更低版本不知道<header> 和<footer> 等新元素。您需要在文档标题中使用 html5shim 之类的东西。

尝试将以下内容添加到 <head> 部分：

<!--[if lt IE 9]>
<script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

【讨论】：

我觉得自己像个白痴。那讲得通。当我回到家时，我会尝试第一件事。谢谢！

【解决方案3】：

因为 IE8 及更早版本不支持页眉和页脚标签（html5 标签）。您必须先创建它们。

【讨论】：