需要CSS下拉菜单建议

Question

我正在尝试制作我的第一个纯css / html下拉菜单，但我很难让Hover功能正常工作。我收到了很好的答案，但这一次，它全都乱了，而且不在正确的位置。我在这一点上迷失了。

http://jsfiddle.net/X5Dbc/

    position: absolute; or somthing like that...

我预感它与positioning有关 在询问“下拉”效应之后，上面的jsfiddle就是我所拥有的。

请记住，在适当的CSS方面，我仍然是新手。任何建议或帮助使这个菜单工作将是非常感谢！建设性的批评总是受欢迎的。

Answer 1

您的加价无效。 ID必须是唯一的。即你不能在muiltiple元素上使用相同的ID。这就是class的用途。无论如何，无需使用ID。

#navwrap ul li ul {
    display: none;
}
#navwrap ul li:hover ul {
    display: block;
    position: relative;
}

将:hover移至父li

您可以单独设置两个ul样式：

顶级：

#navwrap > ul { your styles ... }

综：

#navwrap ul ul { your styles ... }