Bootstrap

Bootstrapのコンポーネントをまとめています。


リストグループ

ulとli要素で作られるリストのグループです。親要素の幅に合うようになっています。

ナビバー

ナビゲーションバーを生成します。navbar-defaultをnavbar-inverseに変更すると、黒が基調のナビゲーションになります。

フロート

.pull-leftで左側へ、.pull-rightで右側の回り込みを行います。div.clearfixで囲むと、その外側の回り込みは解除されます。
CSSを使って画像の横幅を指定します。

サムネール

写真付きの囲み記事として使用されます。外側をdiv.thumbnailで、写真のキャプションをdiv.captionで囲みます。

レスポンシブデザイン

画面の横幅によって、段組を変化させます。div要素に「.col-サイズ-ブロック数」(サイズ:xs/sm/md/lg)のクラスを適用します。複数のサイズのパターンを指定することもできます。このときは、画面の横幅に応じて、一番大きなサイズ用のクラスが有効となります。

コンテナ

全体をdiv.containerまたはdiv.container-fluidで挟むと、左右に余白ができます。div.rowを中に挟むと、余白がなくなります。.containerはウィンドウサイズに対して左右幅固定、.container-fluidは可変幅です。

グリッドシステム

ページの横幅に対して12等分し、n個分のブロックを一つのボックスとします。一つの行を構成する場合は、div.rowを挟みます。