twitter-bootstrap – Twitter Bootstrap 3 – Navbar不是水平的

发布时间：2020-12-18 00:20:18 所属栏目：安全来源：网络整理

导读：我正在用引导程序3进行fiddlin’.我正在尝试制作一个水平导航栏,除了它不会变成水平.我认为导航栏应该是开箱即用的,我是否需要一些额外的CSS？我试图让导航栏从bootstrap文档中复制代码,如下所示： div class="row" div class="col-12" div class="navbar"

我正在用引导程序3进行fiddlin’.我正在尝试制作一个水平导航栏,除了它不会变成水平.我认为导航栏应该是开箱即用的,我是否需要一些额外的CSS？

我试图让导航栏从bootstrap文档中复制代码,如下所示：

<div class="row">
    <div class="col-12">            
        <div class="navbar">
          <div class="navbar-inner">
            <a class="brand" href="#">Title</a>
            <ul class="nav">
              <li class="active"><a href="#">Home</a></li>
                <li><a href="#">Link</a></li>
                  <li><a href="#">Link</a></li>
            </ul>
          </div>
        </div> 
    </div>
</div>

http://jsfiddle.net/FxkZT/

解决方法

DEMO

您的代码适用于BootStrap 2,需要更改.在bootstrap 3中：

>< a class =“brand”href =“#”>标题< / a>变为< a class =“navbar-brand”href =“#”>标题< / a>
>< ul class =“nav”>成为< ul class =“nav navbar-nav”>
>不再需要< div class =“navbar-inner”>

更多信息,请参阅doc here.

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!