Question

我想让品牌居中并链接到它的左右两侧。在下面的例子中，我希望Brand在项目和简历之间。 http://jsfiddle.net/DTcHh/1432/

HTML：

    <a class="site-title" href="{{ site.baseurl }}/">{{ site.title }}</a>
<header class="site-header">
  <div class="navbar navbar-default navbar-fixed-top">
    <div class="container">
      <div class="navbar-header">
        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">Brand</a>
      </div>
      <div class="collapse navbar-collapse">
        <ul class="nav navbar-nav">
          <li><a href="/blog">blog</a></li>
          <li><a href="/projects">projects</a></li>
          <li><a href="/resume">resume</a></li>
          <li><a href="/contact">contact</a></li>
        </ul>
      </div>
    </div>
  </div>
</header>

CSS：

@media (min-width: 768px){
    .navbar-nav{
        margin: 0 auto;
        display: table;
        table-layout: fixed;
        float:none;
    }
}

Answer 1

这听起来有点无聊，但如果你在项目li之前将你的品牌放在li元素内：）

<li><a href="/projects">projects</a></li>
<li><a class="navbar-brand" href="#">Brand</a></li>
<li><a href="/resume">resume</a></li>

中心品牌和左右链接

1 个答案: