IE6 中的透明 GIF 显示 BEHIND 内容答案

【问题标题】：Transparent GIF in IE6 displays BEHIND contentIE6 中的透明 GIF 显示 BEHIND 内容
【发布时间】：2010-12-02 11:18:20
【问题描述】：

我有一个这样的 div：

<div id="pop" class="pop_komm">
    <img src="Graphics/list_updated.gif">
    </div>

这是css：

.pop_komm {
    position: absolute;
    z-index: 20;
    height: 52px;
    width: 208px;
    left: 660px;
    display:none;
    top: 247px;
    zoom:1;
}

上面的 divs style.display 使用 javascript 在下拉列表 onChange 事件上设置为“阻止”。

“pop”div 显示出来了，里面还有图片，但问题是图片显示在内容后面。这只发生在 IE6 中（尚未测试 IE7 或 8）。其他浏览器显示正常。

图片是一个透明的 GIF，我认为这可能与它有关。任何想法如何解决这个问题？

谢谢

【问题讨论】：

（你的图片标签没有关闭）
不支持 IE6，除非您真的，真的必须这样做。这个浏览器需要尽快死掉。
img 标签不需要任何关闭标签，除非 doctype 是 xhtml，如果我没记错的话......
你用jpg试过了吗？设置z-index怎么样？ .pop_komm img { z-index: 20;} 还是把图片指定为div的背景？
除了透明 gif 以外的任何东西都可以正常显示...

标签： javascript html css browser layout

【解决方案1】：

IE 在z-index 方面确实存在一些令人讨厌的问题。

position 样式的默认值为position:static;。此值不参与z-index 排序，这意味着您未指定position 样式的元素可能不会像您期望的那样分层。

解决方案是将position:relative; 添加到任何行为不端的元素 - 即在图像上方分层的元素。

希望对您有所帮助。

【讨论】：

div上面没有层。只是身体。我现在不在工作，但我会尝试更改位置和 z-index 属性，看看是否可以解决问题...

【解决方案2】：

添加相对于图像的位置？

【讨论】：