从Bootstrap 3开始,只是习惯了它. 我已经从Bootstrap 3文档中复制了导航栏,因为它具有我想要的确切功能以及为什么要发明轮子嘿. 我想在标题后放一个Jumbotron,但我希望它是全宽的,所以根据
我已经从Bootstrap 3文档中复制了导航栏,因为它具有我想要的确切功能以及为什么要发明轮子嘿.
我想在标题后放一个Jumbotron,但我希望它是全宽的,所以根据文档,我没有把它放在容器div中.
问题是,当我省略容器div时,它会在标题下滑回,但我希望它从标题结束处开始.如果我把它放在一个容器内,它就可以很好地放在它下面.
有人可以告诉我我哪里出错了,以及如何修复它而不会制造一些将其推倒的黑客div.非常感谢.
我希望将容器保留在标头标签中,因为我不希望这些元素伸展到两侧.
<!-- Docs master nav --> <header class="navbar navbar-inverse navbar-fixed-top bs-docs-nav" role="banner"> <div class="container"> <div class="navbar-header"> <button class="navbar-toggle" type="button" data-toggle="collapse" data-target=".bs-navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a href="../" class="navbar-brand"><img src="imagenes/logo.png" /></a> </div> <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation"> <ul class="nav navbar-nav navbar-right pull-down"> <li class=""> <a href="#">Menu</a> </li> <li class=""> <a href="#">Galería</a> </li> <li class=""> <a href="#">Calendario</a> </li> <li class=""> <a href="#">BH Musicos / Talentos</a> </li> <li class=""> <a href="#">Blog</a> </li> <li class=""> <a href="#">Contacto</a> </li> </ul> </nav> </div> </header> <div class="jumbotron"> <h1>Hello World</h1> <p>Testing one two three</p> </div>如果您查看 navbar docs上的“固定到顶部”部分,则会出现一条警告,提示您向主体添加填充:
Body padding required
The fixed navbar will overlay your other content, unless you add
padding
to the top of the<body>
. Try out your own values or use our
snippet below. Tip: By default, the navbar is 50px high.
body { padding-top: 70px; }
Make sure to include this after the core Bootstrap CSS.