Css 手风琴菜单中的框阴影

我有一个简单的使用jQuery的手风琴菜单，但是我在设计它的样式时遇到了麻烦，所以每个元素都会在随后的每个元素上投射阴影。该菜单由无序列表组成，其中每个元素都是一个链接，在单击时触发向下/向上滑动以显示/隐藏部分。我只希望每个标题（橙色框）在后面的标题上投射阴影，但似乎再多的z索引也无法克服列表设置的默认值（如果我删除列表背景或使阴影向上而不是向下，我可以看到它们）

---

。我已经按降序对列表元素和锚点进行了z索引，但仍然没有成功。有人知道如何让方块阴影在这里正常工作吗？您可以看到shadow查找到的最后一个项目，我想在每个项目下查看。

事实上，您非常接近

原因：

堆栈顺序覆盖了阴影

z索引仅适用于具有

位置的元素，而不是
静态的

因此，解决方案将是： 对于使用

z-index

的元素，添加

position:relative

。因此，再添加一条规则应该会有所帮助：

ul#menu li, 
ul#menu li a {
    position:relative
}

对于大多数浏览器来说应该没问题，除了IE，IE在支持负z索引和position:relative方面有一些小问题，但是因为它们没有很好的框阴影，所以您可以忽略它们

备选方案：如果您不喜欢对每个li使用z索引，您可能更喜欢

插入

框阴影

ul#menu li a { 
    box-shadow:inset 0px 6px 13px #777;
}

Shadow较弱，浏览器支持范围更窄（最新的现代浏览器），但编码更容易

---

p、 对于这个问题，添加CSS标签会有很大帮助。

添加标签！这似乎有效，但只适用于李。是否可以在锚头上获得阴影，以便在选项卡内容打开时投射阴影？谢谢没有关系！知道了。将锚定的z指数设置为高于内容ul，一切正常！非常感谢。