Bootstrap 3.0 #03（Navbar、パンくずリスト）

Navbar

• Navbarを作るときにはnavで囲む
• navbar-defaultでグレーっぽいやつ、navbar-inverseで黒っぽいやつ
• navbar-fixed-topをつけることで、スクロールしても常に上部に配置される
• navbarのヘッダにはa要素にclass="navbar-brand"をつけないと変な表示になる
• navbarの中身はリスト表記で作れる
• navbar-rightで右端に表示される

<nav class="navbar navbar-default navbar-fixed-top">
  <div class="navbar-header">
    <a class="navbar-brand" href="">logo</a>
  </div>
  <ul class="nav navbar-nav">
    <li class="active"><a href="">Home</a></li>
    <li><a href="">About</a></li>
  </ul>
  <ul class="nav navbar-nav navbar-right">
    <li><a href="">Contact</a></li>
  </ul>
</nav>

パンくずリスト（breadcrumb）

• ul要素のクラス指定で作れる
• ちなみにulとは「unordered list」（アンオーダードリスト：順不同リスト）の略
• ul class="breadcrumb"をつけるだけ
• いまいる階層には、li class="active"をつけてあげるとよい

<ul class="breadcrumb">
  <li><a href="">Home</a></li>
  <li><a href="">Member</a></li>
  <li class="active"><a href="">Tanaka</a></li>
</ul>