Bootstrap没有正确显示`.nav.nav-tabs`

Question

我正在快递网站上工作。为了对我的用户界面进行原型设计，我正在使用玉器，不幸的是，这对我来说有点尴尬。当我查看该网站时，我看到了这一点：

我希望它们看起来像这样：http://getbootstrap.com/components/#nav-tabs

我的玉在这里：

//- views/layout.jade

doctype html
html(lang='en')
    head
        meta(charset='UTF-8')
        block BLOCK_STYLES
            link(rel='stylesheet', type='text/css', href='/style.css')
            link(rel='stylesheet', type='text/css', href='//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css')
        title= title ? title : 'Exaid'
    body
        #header
            #nav.nav.nav-tabs
                - var nav = [{ text: 'Home', url: '/' }, { text: 'About', url: '/about' }, { text: 'Contact', url: '/contact' }, { text: 'Connect', url: '/auth' }];
                for button in nav
                    a(href=button.url)
                        li #{button.text}
            #logo
                a(href='/') Exaid
        #main
            block BLOCK_MAIN
        #footer
        block BLOCK_SCRIPTS
            // accidentally deleted jquery line. sorry bout this CDN
            script(type='text/javascript', src='//code.jquery.com/jquery-2.1.3.min.js')
            script(type='text/javascript', src='//rawgit.com/julianshapiro/velocity/master/velocity.min.js')
            script(type='text/javascript', src='/script.js')
            script(type='text/javascript', src='//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js')

我检查过错误，但唯一一个与非相关的空脚本文件有关。我做错了吗？

Answer 1

你永远不会设置包含导航的实际<ul>。

ul.nav.nav-tabs
  li: a.active(href="link") Link Text
  li: a(href="link") Link Text

是最简单的方法。