Bootstrap没有按预期工作

我使用twitter引导node.js用户界面，下面的HTML是我得到后，我使用Jade我想要的是使用jumbotroon http://getbootstrap.com/examples/jumbotron/，并把标签1和2在在导航栏上的项目名称相同的行，并使用链接中的黑色，我已经尝试了很多东西，我在这里做错了什么？

<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" /> <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap-theme.min.css" rel="stylesheet"></link> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <nav class="navbar navbar-inverse" role="navigation"> <div class="container-fluid"> <div class="navbar-header"> <button class="navbar-toggle" data-target="#bs-example-navbar-collapse-1" data-toggle="collapse"></button> </div> <a class="navbar-brand" href="/#"> Node Rec </a> <div id="bs-example-navbar-collapse-1" class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li> <a href="/recipes/b1"> Tab1 </a> </li> <li> <a href="/recipes/b1"></a> </li> </ul> <div class="container"></div> <div class="jumbotron"></div> <h1> List Arrivals </h1> <ul> <li> 33: LAX-Tue Dec 02 2014 16:04:41 </li> <li> 13: MKE-Tue Dec 02 2014 16:05:48 </li> <li></li> <li></li> </ul> </div> </div> </nav> 

这是现在的样子

当我把它改成navbar-inverse的时候，我得到了相反的情况，这并不是一个强壮的外表

Answer 1

这可能是一个开始。 我已经将<nav> jumbotron <nav>移到了<nav> 。

 <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" /> <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap-theme.min.css" rel="stylesheet"></link> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <nav class="navbar navbar-inverse" role="navigation"> <div class="container"> <div class="navbar-header"> <button class="navbar-toggle" data-target="#bs-example-navbar-collapse-1" data-toggle="collapse"></button> </div> <a class="navbar-brand" href="/#"> Node Rec </a> <div id="bs-example-navbar-collapse-1" class="collapse navbar-collapse"> <ul class="nav navbar-nav"> <li> <a href="/recipes/b1">Tab1</a> </li> <li> <a href="/recipes/b1">Tab2</a> </li> </ul> </div> </div> </nav> <div class="container"> <div class="jumbotron"> <h1> List Arrivals </h1> <ul> <li> 33: LAX-Tue Dec 02 2014 16:04:41 </li> <li> 13: MKE-Tue Dec 02 2014 16:05:48 </li> <li></li> <li></li> </ul> </div> </div> </div>