我在网站上使用引导程序,并且导航栏固定顶部出现问题。当我只使用常规导航栏时,一切都很好。但是,当我尝试将其切换到导航栏固定顶部时,该网站上的所有其他内容都会向上移动,就像导航栏不存在并且导航栏与之重叠一样。我基本上是这样布置的:
.navbar.navbar-fixed-top .navbar-inner .container .container .row //yield content
我试图完全复制引导程序示例,但仅在使用navbar fixed top时仍然存在此问题。我究竟做错了什么?
您的答案是正确的docs:
### 需要身体填充
固定的导航栏将覆盖您的其他内容,除非您将其添加padding到的顶部<body>。试用您自己的值或使用下面的代码段。提示:默认情况下,导航栏的高度为50px。
padding
<body>
body { padding-top: 70px; }
确保在核心Bootstrap CSS 之后 添加此名称。
并在 Bootstrap 4文档中…
固定的导航栏使用位置:固定,这意味着它们是从DOM的正常流程中拉出的,并且可能需要自定义CSS(例如上的padding-top)以防止与其他元素重叠。