如何使用z-index将子ul置于父ul之下

Question

我试图将我的孩子ul置于父母ul下，所以我有

http://jsfiddle.net/hjJYN/

代码snipplet

ul {
    position: relative;
    z-index: 5;
}
li ul {
    position: absolute;
    z-index: 2;
}

但是我的孩子仍然在父母之上，为什么会这样。使用普通的旧div，我可以使用z-index ok为什么不使用uls？ http://jsfiddle.net/MjHBT/

Answer 1

试试这个

ul {
    position: relative;
}
li ul {
    position: absolute;
    z-index: -2;
}

换句话说，删除父级的z-index并为孩子提供否定z-index。这导致子菜单的悬停失败，而负z-索引的东西感觉不对。

Answer 2

你可以给嵌套的ul一个margin-top：0，将它放低，然后给它成方角。它看起来不错

Answer 3

添加到孩子的ul位置：绝对;

ul {
    position: relative;
    z-index: 5;
}
li ul {
    z-index: 1;
    position:absolute;
}