这个小提琴应该证明这个问题：
我希望子菜单显示在父菜单下面。我当时希望用JavaScript扩展它，以便在父li元素的悬停下从下面滑动菜单。
没有关于JavaScript的讨论，但无法弄清楚如何设置元素的样式以实现所需的分层。
答案 0 :(得分：12)
它不起作用，因为您正在将z-index应用于父元素，这使得子元素堆栈相对于父中的其他元素。
为元素指定值后 z-index（除了auto），那个 元素建立自己的本地 堆叠上下文。这意味着所有 该元素的后代有 他们自己的堆叠顺序，相对于 祖先元素。
因此，如果父级z-index: 9且子级为z-index: 8，则有点像指定9, 8
有关更好的解释，请参阅the article here。
如果删除父项上的z-index并将同级元素设置为z-index: -1，则应该可以。我不确定所有浏览器，但无论如何它都适用于Chrome。
希望有所帮助。
答案 1 :(得分：4)
答案 2 :(得分：1)
尝试将父级和兄弟级容器位置设置为相对位置。 它以前对我有用。
答案 3 :(得分：1)
请查看下面的规则，了解元素的堆叠方式，您可以轻松找到自己的解决方案。
离。就像thirtydot所说，给“登录”.users > li > a一个职位，relative或absolute，z-index: 1
The Stacking order and stacking context rules below are from this link
元素的顺序：
<html>元素是默认情况下唯一的堆叠上下文，但任何元素都可以是堆叠上下文的根元素，请参阅下面的规则）
<html>元素）