Twitter Bootstrap 3.0のグリッドシステムの変更点を調べてみた。

Twitter Bootstrap 3.0がリリースされていた。

グリッドシステムが2.3から変更になったみたい。

2.3では

<div class="row">
   <div class="span2">・・・</div>
   ・・・
</div>

だったけれど、3.0からは

<div class="row">
   <div class="col-md-2">・・・</div>
   ・・・
</div>

のようになった。

mdの部分はほかにxs、sm、lgを指定できて、デバイスの画面幅によって振る舞いを変更できる。

.visible-xxと.hidden-xxと組み合わせると、指定した範囲の可視・不可視を制御できるので便利そう。

ここらへんは公式サイトに説明があるけれど、DotInstallの解説がわかりやすかった。

他にも変更点がいくつかあるようなので、ひと通りドキュメントを読んで試してみたいと思う。