悬停时子菜单不可见答案

【问题标题】：Submenu is not getting visible on hover悬停时子菜单不可见
【发布时间】：2015-10-18 23:36:15
【问题描述】：

请参阅我的代码和演示Here。我不太习惯使用 css，但它很简单，我看到许多演示几乎使用相同的代码。但我无法发现导致问题的差异

我需要在UserForm 下打开一个子菜单，但它在悬停时不可见（使用 css）

【问题讨论】：

【解决方案1】：

像这样从#main_nav ul ul 中删除“top”和“left”：

#main_nav ul ul {
    position: absolute;
    visibility: hidden;
}

这是因为“位置：绝对”的工作方式。在您的情况下，父“li”具有“位置：静态”（默认），在这种情况下，“位置：绝对”使子 ul 在整个文档中绝对放置。如果您只是删除“可见性：隐藏”然后将其放置在页面底部，您可以看到这一点。另一种解决方案是将“位置：相对”设置为父li

【讨论】：

就是这样。对，你能解释一下为什么只有当我删除它们时它才能工作。定位有什么问题？
这是因为“位置：绝对”的工作方式。在您的情况下，父“li”具有“位置：静态”（默认），在这种情况下，“位置：绝对”使子 ul 在整个文档中绝对放置。如果您只是删除“可见性：隐藏”然后将其放置在页面底部，您可以看到这一点。另一种解决方案是将“位置：相对”设置为父 li。