.pull左

Question

我正在尝试从Bootstrap创建一个导航栏。名称，关于，投资组合，联系人等应该在同一行。除了右边的更多，其他的应该在左边。但是，通过我的代码，所有这些都显示在中间。我尝试了几种方法来修复，但没有功能。你能给我一些建议吗？谢谢。代码如下：

`<body>
    <nav class="navbar navbar-inverse" role = "navigation">
    <div class = "container-fluid">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">Name</a>
        </div>
        <ul class="nav nav-pills">
            <li class = "active"><a href ="#">ABOUT</a></li>
            <li><a href = "#">PORTFOLIO</a></li>
            <li><a href = "#">CONTACT</a></li>
        </ul>
        <ul class="nav navbar-nav navbar-right"> 
            <li><a href="#"><span class="glyphicon glyphicon-user"></span>Contact</a></li>
        </ul>
    </div>
    </nav>
</body>`

Answer 1

尝试在div中添加类left，希望将其留下

.left {
  float: left !important;
}

<ul class="nav nav-pills left">
   <li class = "active"><a href ="#">ABOUT</a></li>
   <li><a href = "#">PORTFOLIO</a></li>
   <li><a href = "#">CONTACT</a></li>
</ul>

Answer 2

Bootstrap有一个名为X.a的类，它将pull-left添加到元素中。

.pull左

float: left !important;

参考：https://github.com/twbs/bootstrap/blob/v3.3.7/dist/css/bootstrap.css#L6519-L6524

＆＃13;

.pull-left {
  float: left !important;
}

＆＃13;

如何将导航栏放在左侧的引导程序中？

2 个答案:

.pull左