Css IE 8中未显示PNG背景图像<；使用html5？

我有以下html代码：

<section class="first-content-top">
    <img src="images/img-diner.png" />
    <h1>Menu</h1>
</section>
<section class="first-content-middle">
         <article class="menu">
     </article>
</section>
<section class="first-content-bottom"></section>

但在IE8中，我仍然看不到背景图像，就像我在IE9或firefox中看到的那样：

这是IE8的图片：

下面是firefox的图片，它应该是什么样子：

我尝试了以下解决方案：

为了防止这个问题，我在页面的头部添加了以下html5shiv代码：

<!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

在firebug中，我检查以确保section元素具有

display:block属性集

编辑：将
height
css属性添加到该部分可以修复背景问题。但是截面高度是可变的。那么我该如何解决这个问题呢

有什么建议吗？
这可能与您的问题有关。通常IE9及以下版本不喜欢透明度和不透明度

IE7和IE8对alpha透明胶片具有本机PNG支持，但一旦不透明度进入图片，它就会崩溃。设置不透明度的任何值时，即使是100%（即过滤器：alpha（不透明度=100）），ie也会使用纯黑色填充填充PNG的alpha透明度。这有时被称为“黑色光环”。alpha过滤器可随时移除，以移除填充物并恢复alpha透明度，但支持两者需要使用更多IE的专用过滤器。以下所有示例都应放在IE targete中

/* Normal CSS background using an PNG with an alpha transparency */
#demo {
background:url(ie8-logo.png) 0 0 no-repeat;
}  

.第一个内容中间
{
背景：url（“images/bg black.png”）重复滚动0；
利润率：0.37px；
填充：0 20px；
宽度：595px；
}

从背景中删除透明图像
您的png背景图像需要至少为4x4px。
您需要在CSS中将section设置为display:block

使用IE，即使使用shiv，也需要声明HTML5元素
作为块元素。我在Internet Explorer中使用这一行，但您可以
根据需要的元素修改它

header,nav,article,footer,section,aside,figure,figcaption{display:block}

来自Modernizer文档：“您可能还需要设置
要显示的许多元素：块

从
中，我们可以在任何testserver或JSFIDLE上检查这一点吗？注意：这是一个测试，所以无论什么都可以，但在生产时，如果
IE lte 8
或
IE lt 9
，则应该添加html5shiv，而不是在IE9和IE10上，这是没有用的。@FelipeAlsacreations好的，谢谢你的提示。我很乐意帮助你解决这个问题，但真的，我想我没有足够的信息。需要JSFIDLE中的问题工作示例或更多代码，因为这很可能是导致问题的代码交互。如果你不能发布一些问题，那么你能发布三个不同
部分
元素的所有css以及
文章
元素的示例html/css吗？这可能有助于跟踪解决方案。在Win 7上的IE8模式下，它对我来说很好，所以要么你修复了它，要么它是特定于某些其他因素（操作系统等）。我想我帮不了什么忙。那代码只对img元素有效，而对背景图像无效。这正是问题所在。有什么建议吗？很抱歉，它并没有说透明。这是firebug代码。我会将我的anwser更改为正确的css源代码。没有css不透明度。这已经进入导致问题的背景图像。仍然不工作，抱歉。这里有一个指向开发人员环境的链接：此链接已断开-这似乎是一个很好的解决方案：
header,nav,article,footer,section,aside,figure,figcaption{display:block}