Html 我的下拉菜单怎么了？
我目前正在学习CSS和HTML，我想建立一个只使用CSS的基本下拉菜单。如果有人能帮我弄清楚到底发生了什么，有些事情我就不明白了 这是它的样子 为什么我的菜单1被推到导航的顶部？我怎样才能避免呢？ 为什么我的子菜单1在菜单1的右侧？我怎么修理它？ 我的子菜单的高度超出了第一个UL。应该是这样吗 希望有人能帮助我理解这里发生了什么，这对我自己来说是一个宝贵的教训。我知道我可以找到一个在线教程，但我觉得从头开始是一个更好的学习机会，但现在我被卡住了Html 我的下拉菜单怎么了？,html,css,drop-down-menu,Html,Css,Drop Down Menu,我目前正在学习CSS和HTML，我想建立一个只使用CSS的基本下拉菜单。如果有人能帮我弄清楚到底发生了什么，有些事情我就不明白了 这是它的样子 为什么我的菜单1被推到导航的顶部？我怎样才能避免呢？ 为什么我的子菜单1在菜单1的右侧？我怎么修理它？ 我的子菜单的高度超出了第一个UL。应该是这样吗 希望有人能帮助我理解这里发生了什么，这对我自己来说是一个宝贵的教训。我知道我可以找到一个在线教程，但我觉得从头开始是一个更好的学习机会，但现在我被卡住了 谢谢 好的，这里有一些要点，我仍然建议你找一些类似
谢谢 好的，这里有一些要点，我仍然建议你找一些类似或任何你能找到的页面来了解更多或完全理解你的问题 菜单1被推开，因为您将第二个ul设置为可见性：隐藏-它隐藏，但仍占用相同的空间宽度和高度，因此如果您将其更改为显示：无，并删除高度：100px，在第一个ul中，它将变为一行，并且平滑。不要将高度设置为ul，特别是当它内部有1个或多个ul时，它将破坏您的菜单 你的子菜单1在菜单1的右边，因为，嗯，我不知道怎么说，所以我跳到解决方案来解决这个问题。要定位您的子菜单，我建议使用position:absolute with margin将您的子菜单定位在主菜单旁边（如果是垂直菜单），如果是水平菜单，则定位在主菜单下方 这是你的新CSS后，我修改了一点
body {margin: 0; padding: 0;}
nav {background-color: pink; margin: 0; padding: 0; height: 100px;}
ul {list-style: none; width: 50%; background: yellow; margin: 0 auto}
li {display: inline-block; background-color: green; width: 100px; height: 50px}
a {text-decoration: none;}
ul > li > ul {display: none; position: absolute; margin: 35px 0 0 -40px;}
ul > li:hover > ul {display: block;}
ul > li > ul li {display: block;}