需要CSS下拉菜单建议

Question

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

http://jsfiddle.net/X5Dbc/

    position: absolute; or somthing like that...

我有一个预感,它与positioning 上面的jsfiddle有关,就是我在询问"下拉"效果之后的情况.

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

Answer 1

您的标记无效。IDs 必须是唯一的。即你不能ID在多个元素上使用相同的方法。这就是class目的。无论如何，没有必要ID为此使用 s 。

#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 ... }