html - 2个引导导航栏重叠（希望一个固定在另一个下方）

Question

我有这个有 2 个导航栏的网站，但是深色的导航栏一直被浅色的导航栏覆盖，我想要顶部的浅色导航栏和下方的深色导航栏，我的代码有什么问题？

链接：https ://paragon.fun/punishments/bans.php

标签： htmlcsstwitter-bootstrapnavbar

Answer 1

它发生是因为positioning您指定了。您正在使用fixed浅色导航栏和relative深色导航栏。

这取决于您想要达到的目标。如果深色导航栏应位于浅色导航栏fixed下方，您只需添加以下 CSS：

.navbar-inverse {
  position: fixed;
  top: 50px;
  width: 100%;
}

但是，如果深色导航栏应该简单地位于浅色导航栏下方，并且没有任何粘性，则需要指定top距离：

.navbar-inverse {
  top: 50px; // equal to the light navbars height
}

发生这种情况的原因是因为您fixed在轻导航栏上使用定位，它将从documentflow. 固定元素将不再影响relative定位元素的定位，如深色导航栏。