Question

我有以下情况，不确定z-index在这种情况下应该如何工作：

<div style="z-index:0">
My Content
    <div style="z-index:-100">
       My Invisible Content
            <div style="z-index:100">
               My Visisble handle
            </div>
    </div>
</div>

我想要“我的可见句柄”......好吧，可见。目前它不是。我怎样才能看到它？

谢谢

Answer 1

因为div是嵌套的，所以z-index值彼此不相关。

尝试一个非常高的z-index值，它可能适用于某些浏览器而不是其他浏览器，所以最好让div想要在相同的上下文中相互关联（嵌套级别）

Answer 2

如果真的需要继续使用该HTML，您可以/应该：

定位你的div（不可见 - ＆gt;相对，可见 - ＆gt;绝对）。
将可见一个放在隐形上（visibile - ＆gt; top：0; left：0;）
如果您不想查看背后的内容，可以在可见中添加背景;）
添加固定宽度＆amp;两者的高度（如果不可见的内容更宽）

结果在此处：http://www.jsfiddle.net/H7BwV/

重叠div中的z-index

2 个答案: