[Bootstrap]初めてのBootStrap6:navigation

今日は、ナビゲーションの実装方法について書きたいと思います。

Nav, tabs, and pillsを読みながら実装した結果、下のコーディングになりました。

<div class="container"> <div class="row"> <div class="span12"> <ul class="nav nav-tabs"> <li class="active"> <a href="#">Home</a> </li> <li> <a href="#">New</a> </li> <li> <a href="#">Update</a> </li> </ul> </div> </div> </div>

]<div class="container"> <div class="row"> <div class="span12"> <ul class="nav nav-pills"> <li class="active"> <a href="#">Home</a> </li> <li> <a href="#">New</a> </li> <li> <a href="#">Update</a> </li> </ul> </div> </div> </div>

それぞれの実行結果は、下のようになりました。


ある程度、形式化されており、違いは、ulタグに付与するクラス名だけなので、臨機応変に使い分けることができそうです。