Question

我在制作这个标题时遇到了一些麻烦。

情况是：

#B{
    width:100%;
    height:100%;
    z-index:1;
}

#A{
    position:absolute;
}

#C{
    position:absolute;
    bottom:0;
    width:300px;
    height:60px;
    left:50%;
    margin-left:-150px;
    z-index:5;
}

B是全屏div，C是绝对定位的页脚元素，始终显示在所有其他元素上，包括B.

A是B内部的弹出窗口，此弹出窗口的位置会发生变化，因此有时它会与页脚重叠。问题是，我需要这个弹出窗口显示在页脚上，而它的父div仍然在页脚下。这可能吗？简单地改变A的z-index什么都不做。

当前的CSS：

csv

我意识到我可以从B中取出A并将其直接放入体内，但这意味着重写一些Javascript，而且如果上述重叠类型是可能的，我也很好奇。

Answer 1

z-index难题 - 如果A是B的孩子而C显示在B上，A可以显示在C上吗？

如果B为A建立堆叠上下文，则为否，因为A在B的堆叠上下文中被隔离，并且不能与堆叠上下文之外的框重叠（除非堆叠上下文本身与这些框重叠，这意味着B必须与C重叠）

所以，如果没有将A移出B，或者阻止B建立堆叠上下文，那么你想要做的事情是不可能的（在你的例子中，不清楚B的z-index: 1声明的用途是什么，但我认为你的实际布局会有更多的事情让这个选项变得非常重要。）

z-index难题 - 如果A是B的子节点并且C显示在B上，A可以显示在C上吗？

1 个答案: