Html 如何在bootstrap 3.3.7中的导航栏下方添加下拉列表

因此，我试图使我的下拉列表实际显示在导航栏下方，如图所示

这是我的html：`

这就是我希望它看起来的样子：

这就是它与实际导航栏重叠的样子：

---

我尝试过一些不同的方法，比如在页眉底部加一个边距，但没有效果。如果有人能帮上忙，我将不胜感激，因为我不知道接下来该怎么办。如果你也能告诉我到底是什么css需要改变，那就太好了。谢谢。

您只需调整.dropdown menu类上的“top”值，它是绝对定位的。现在大概是100%

.dropdown-menu {
  top: 100%;
}

这将使它与li的底部对齐。下拉菜单>元素， 因此，如果您从导航栏填充中额外获得20像素的黑色背景，请尝试以下操作：

.dropdown-menu {
  top: calc(100% + 20px);
}

---

谢谢我回家后会试试看它是否管用！

.dropdown-menu {
  top: 100%;
}

.dropdown-menu {
  top: calc(100% + 20px);
}