下面是我当前使用 bootstrap 3.1.1 实现 Navbar 的链接。
我也对所有 Nav 使用了容器类。这是正确的实现吗?如果我不使用容器类来导航,它会超过容器的宽度。所以我不得不使用它。有人可以确认其实现是否正确吗?
当我单击任何按钮时,MainContent 子 div 的向上滑动或向下滑动,一旦它穿过导航栏。我希望它被隐藏(你在导航栏上方看到的滚动 div),但它没有隐藏。我试图在 Nav 上方再添加一个 div,但即使这样也超出了容器的宽度,尽管它位于容器内部。所以我也尝试为此使用容器类,它工作正常但是当我将浏览器调整为小尺寸时 div 消失并且我再次能够看到 mainContent 子元素能够移动导航栏。
<
HTML
<meta charset=”utf-8”>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<html>
<head>
</head>
<body>
<div class="container">
<div id="header">
<nav class="navbar navbar-default navbar-fixed-top container" role="navigation">
<div class="container inside-bar">
<ul class="nav navbar-right">
<li class="active"><a href="#about">About</a></li>
<li><a href="#Services">Services</a></li>
<li><a href="#OurStaff">Our Staff</a></li>
<li><a href="#book">book</a></li>
<li><a href="#Gift">Gift Cards</a></li>
<li><a href="#Reviews">Reviews</a></li>
</ul>
</div>
</nav>
</div>
<div id="mainContent">
<div id='Services' class="box">
Services
</div>
<div id='about' class="box">
About
</div>
<div id='OurStaff' class="box">
Our Staff
</div>
<div id='book' class="box">
book
</div>
<div id='Gift' class="box">
Gift
</div>
<div id='Reviews' class="box">
Reviews
</div>
</div>
</div>
</body>
</html>
目前在链接中您将看不到我在 Nav 之前添加的 Div。
最佳答案
您可以添加容器。执行没问题
-
.navbar-default{ background: black !important; padding-left: 0px; border-color: rgba(231, 231, 231, 0) !important; text-transform: uppercase; }
关于html - BootStrap 3.1.1 导航栏,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23976855/