ナビゲーションバーの使い方を説明します (ver 2.x)。

基本

以下のように、3つのdivを用意し、その中にul要素を指定してください。

<div class="navbar">
  <div class="navbar-inner">
    <div class="container">
      <ul class="nav">
	<li><a href="#">リンク1</a></li>
  	<li><a href="#">リンク2</a></li>
  	<li><a href="#">リンク3</a></li>
      </ul>
    </div>
  </div>
</div>

ul要素の中の各li要素が、ナビゲーションバーに表示されます。

ブランド名を追加

Webサイト名のような「ブランド名」を追加することもできます。

<div class="navbar">
  <div class="navbar-inner">
    <div class="container">
      <a class="brand" href="#">SWEng TIPS</a> <!-- ここに追加 -->
      <ul class="nav">
	<li><a href="#">リンク1</a></li>
  	<li><a href="#">リンク2</a></li>
  	<li><a href="#">リンク3</a></li>
      </ul>
    </div>
  </div>
</div>

画面上部に常に表示

ページを縦にスクロールしても、常に画面上部にナビゲーションバーが表示されるようにすることもできます。

<div class="navbar navbar-fixed-top"> <!-- ここに navbar-fixed-top を追加 -->
  <div class="navbar-inner">
    <div class="container">
      <a class="brand" href="#">SWEng TIPS</a>
      <ul class="nav">
	<li><a href="#">リンク1</a></li>
  	<li><a href="#">リンク2</a></li>
  	<li><a href="#">リンク3</a></li>
      </ul>
    </div>
  </div>
</div>

ナビゲーションバー固定のサンプル