如何将子元素覆盖在父元素上

Question

我有一个<li>元素，其中包含一个无序列表。当用户将鼠标悬停在父<li>元素上时，将显示无序列表。最近，<li>和子<ul>元素添加了一个边框，而<li>没有底边框。我想隐藏<li>底部后面的子无序列表顶部边框，以便它将切断该部分的无序列表的边界。

这是我创建的小提琴 - http://jsfiddle.net/EZRU9/3/

请注意，这与原始实施很接近。我尝试将父<li>更改为具有绝对位置，但这不起作用，我将其更改回来。当我尝试这个时，我可能做了别的错事，但是自从我改回来之后，我创造了一个小提琴来模仿我现在拥有的东西。

Answer 1

您不能使用z-index将父项放在子项前面。我在这种情况下的建议是：在<li>中添加一个额外的元素，给它position: absolute;以及与之匹配的背景颜色，然后将其定位为覆盖<ul>边框的一部分。

Answer 2

将顶级文字（“标签1”）换行到您选择的范围或其他标签中。然后你可以根据需要设置样式和堆叠。