グローバルナビ基本例

PCでウインドウサイズを変更しながら確認してみてください。


デフォルト(白背景)メニュー

.navbar-defaultを指定。


黒背景メニュー

.navbar-inverseを指定。


角丸なしメニュー

.navbar-static-topを指定。
クラス名からも分かるように最上部に静止するようなメニュー用に用意されたクラスかと思います。


サイト名入りメニュー

.navbar-static-topを指定。


ドロップダウンメニュー

.dropdown-menuを指定。


リンクの右寄せ

.navbar-rightを追加指定。タブレットサイズ(768px)以上の時のリンク表示が右寄せになります。


コンテンツのオーバーフロー

リンクが多い時などの挙動サンプル。ウインドウサイズを変更しながら表示を確認してみてください。


ダミーテキスト