Bootstrap：简单的导航对齐问题

Question

我想在主要顶部导航旁边对齐“注册或登录”部分，就像图像一样。我想我可以有另一个ul，但这可能不是最好的方法。

这是我到目前为止所做的：

<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="sr-only">Toggle Navigation</span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>

        <a class="navbar-brand" href="#">
          <div class="logo">
            Logo
          </div>
        </a>
      </div>
      <div class="navbar-collapse collapse">
          <ul class="nav navbar-nav navbar-right">
            <li><a href="#">HOME</a></li>
            <li><a href="#">ABOUT</a></li>
            <li><a href="#">JOBS</a></li>
            <li><a href="#">CANDIDATES</a></li>
            <li><a href="#">CLIENTS</a></li>
            <li><a href="#">CONTACT</a></li>
          </ul>
      </div>
  </div>
</div>

你会如何推荐我这样做？

Answer 1

在你的最终李之后的你的ul中添加一个跨度。在该范围内，您可以添加注册按钮Register和LOGIN。这样做将允许那些与其他列表项分开，但它们也会崩溃。您需要对按钮进行一些样式设置，使其看起来像图片中的“注册”按钮，并且需要垂直对齐您的按钮。