我正在尝试制作我的第一个纯css / html下拉菜单,但我很难让Hover功能正常工作.我收到了很好的答案,但这一次,它全都乱了,而且不在正确的位置.我在这一点上迷失了.
position: absolute; or somthing like that...
我有预感,它与定位有关
上面的jsfiddle是我在询问“下拉”效果之后的内容.
请记住,在适当的CSS方面,我仍然是一个新手.任何建议或帮助使这个菜单工作将是非常感谢!建设性的批评总是受到欢迎.
最佳答案
您的标记无效. ID必须是唯一的.即你不能在muiltiple元素上使用相同的ID.这就是上课的目的.无论如何都不需要使用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 ... }