隐藏在后面的下拉菜单答案

【问题标题】：Drop down menu hidden behind隐藏在后面的下拉菜单
【发布时间】：2013-10-21 10:52:28
【问题描述】：

我创建了一个下拉菜单，但我遇到的问题是，当我将鼠标悬停在顶部导航菜单上时，下拉菜单项隐藏在滑块和内容后面。我在网上查看并试图找出问题，但无法解决。有谁能帮帮我吗？如果可能的话，请解释得很好。提前致谢，海伦

【问题讨论】：

请添加您尝试过的代码示例。

【解决方案1】：

这很可能归结为页面上各种元素的 css z-index。较高的 z-index 值会将内容定位在较低的 z-index 值之上（假设它们具有定位值）。但是，您必须记住，子元素不能获得比其父元素更高的 z-index，或者至少您可以将 z-index 分配给任何值，但它们将始终保留在父元素 z 处的父元素中-索引值。页面上的滑块很可能具有比标题/菜单栏更高的 z-index。

【讨论】：

【解决方案2】：

另外，请确保您有 position:relative、position:absolute 或 position:fixed ，否则 z-index 将被忽略。

【讨论】：

【解决方案3】：

如果您使用的是 HTML 列表，例如<ul> 尝试将更高的 z-index 添加到您的列表中，以使其高于其他所有内容。

.dropdown li {

z-index:999;
position:relative;

}

【讨论】：

如果您想将我的答案选为最佳答案，那就太好了:)

【解决方案4】：

我在使用下拉菜单时遇到了类似的问题，它显示在滑块后面。滑块的 z-index 范围为 1-5，因此我将下拉菜单的 z-index 设置得更大，现在它可以正确显示了。

【讨论】：