Bootstrap导航栏未按预期显示文本

Question

我在Node.js上工作，想使用带有一些按钮和文本的导航栏来单击和导航问题是按钮和文本没有显示在导航栏中，您在下面看到它们，我在做什么错这里 ？

对于以下代码，我使用express＆jade http://jade-lang.com ，它可以帮助您编写html页面，方法很简单...

我希望它像下面的http://getbootstrap.com/examples/jumbotron/ ，相反，您将看到的项目名称为tab1和tab2等

更新的代码

目前，文本（tab1＆2）未显示在导航栏上，该如何更改？

html
    head
        title= title
        link(rel="stylesheet", href="bootstrap.min.css")
        link(rel='stylesheet', href='//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap-theme.min.css')
        script(src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js')

        nav.navbar.navbar-default(role='navigation')
           .container-fluid
               .navbar-header
                    button.navbar-toggle(data-toggle='collapse', data-target='#bs-example-navbar-collapse-1')
                        span.sronly
                        span.icon-bar
                        span.icon-bar
                        span.icon-bar
                   a.navbar-brand(href='/#
               #bs-example-navbar-collapse-1.collapse.navbar-collapse
                   ul.nav.navbar-nav
                       li
                           a(href='/recipes/1') Tab1
                       li
                           a(href='/recipe2') Tab3
                   body        
                   div.container
                   block content

Answer 1

嵌套元素要求您正确缩进。 您也可以在元素上使用.class-name来应用类。

html
    head
        title= title
        link(rel="stylesheet", href="bootstrap.min.css")
        link(rel='stylesheet', href='//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap-theme.min.css')
        script(src='//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js')
    body
        nav.navbar.navbar-default(role='navigation')
           .container-fluid
               .navbar-header
                    button.navbar-toggle(data-toggle='collapse', data-target='#bs-example-navbar-collapse-1')
                        span.sronly
                        span.icon-bar
                        span.icon-bar
                        span.icon-bar
                   a.navbar-brand(href='/#') Node Recipes
               #bs-example-navbar-collapse-1.collapse.navbar-collapse
                   ul.nav.navbar-nav
                       li
                           a(href='/recipes/bbq') Tab1
                       li
                           a(href='/recipes/bbq') Tab2