グリッド・システム　　Grid system

Bootstrap3には、とても柔軟なグリッドが用意されている。

モバイル、タブレット、デスクトップ、幅広デスクトップの４つの表示領域に対応するレスポンシブ・グリッド・システムだ。

使い方

1. class属性にrowを指定したdiv要素を用意する。このdiv要素は、class属性にcontainerかcontainer-fluidを指定した要素内に配置する。
2. １のdiv要素内に、class属性にcol-*-*を指定したdiv要素を配置する。
3. col-*-*における１つ目の*には、表示幅を意味するxs、sm、md、lgの何れかを指定する。
4. col-*-*における２つ目の*には、カラム数を指定する。一行における最大カラム数は12。

<div class="container-fluid">
	<div class="row">
		<div class="col-md-4">カラムＡ</div>
		<div class="col-md-4">カラムＢ</div>
		<div class="col-md-4">カラムＣ</div>
	</div>
</div>

グリッドの仕様

サンプル