Html CSS z索引不使用子元素

我尝试过一个个人项目的待办菜单，它是在最高层（z-index 3）打开的，所以它们覆盖在我的板上，但是它们所在的标题在最底层（z-index 1），所以板被分配到中间层（z-index 2）。 从逻辑上讲，我觉得这很好，但菜单显示在z索引2之下。。。 我已经没有办法解决这个问题了

*{
保证金：0；
填充：0；
}
#标题{
宽度：512px；
高度：256px；
位置：固定；
z指数：1；
背景色：红色；
}
div>ul{
宽度：512px；
高度：128px；
位置：固定；
z指数：3；
背景颜色：蓝色；
}
ol{
宽度：480px；
高度：320px；
利润率：32px 16px 0 16px；
位置：固定；
z指数：2；
背景颜色：绿色；
}

子元素的z索引始终是父元素的z索引 只能将图元放置在相同的图层上。 因此，在您的情况下，

#标题

中的每个元素都将位于

z-index 1

上，而

是

z-index 2

如果

也在该容器内，则未排序列表中的

z-index:3

仅在

#标题中起作用

<div id="header">
   <ul></ul>
   <ol>
   </ol>
</div>




因此，在这种情况下，您想要实现的目标是不可能的。您必须更改html结构。或者将
#header
中的z索引设置为高于
中的z索引，这是因为
ul
父级（与
ol
处于同一级别）具有
z索引：1

如果您将
ul
和
ol
放在同一级别，它将按预期工作
这里有什么问题？请在问题中包含您的代码，而不仅仅是一个格式化为代码的链接。参见@DomlThe Bread基本上蓝色的
应该显示在绿色的
上方，但红色的
#标题的其余部分应该在后面请参见我的回答：