如何拥有两个导航栏？一个带有默认的bootstrap导航栏，另一个带有该导航栏下的另一个页眉

Question

我有一个默认的bootstrap导航栏，我想在导航栏下方有一些标题。

任何帮助都将不胜感激。

Answer 1

这种结构是否有效？这是您的参考网站正在做的事情。

<div id="header">
   <!-- navigation markup here -->
</div>
<div id="sub-header">
   <!-- sub header markup here -->
</div>

您真正需要做的就是在导航容器元素后放置一个块级元素。真正的基本标记。

Answer 2

以下是他们在链接网站上的表现。

     <div id="sub-header" class="green-header">
         <div class="inner-wrap clearfix">
            <h1>A Community Where Golfers Share, Discover and Discuss All Things Golf</h1>
            <ul>
               <li><a href="/signup/" title="Join the Community" class="join-button">Join the Community</a></li>
               <li>or <a href="/signin/">Sign in</a></li>
            </ul>
         </div>
      </div>

...的CSS

#sub-header {
    background: #2c3036 none repeat scroll 0 0;
    color: #d9d9da;
}
.green-header {
    background: #277f6d url("/assets/images/green_sub_bg.png") repeat-x scroll left top !important;
    color: #eaf6f4 !important;
}
* {
    box-sizing: border-box;
}
*::-moz-placeholder {
    color: #ccc;
}
body {
    color: #444;
    font: 100%/1.5 "Open Sans",Helvetica,Arial,sans-serif;
}