グリッドをオンラインで簡単に設計・作成できる -960 Layout System

ページの幅、カラムの数、溝の幅を任意で設定し、グリッドレイアウトのベースを設計・作成できるオンラインサービスを紹介します。

960 Layout System

上記のキャプチャはグリッドを生成したもので、初期画面は下記のようになります。

グリッドの作成方法は簡単です。

1. 「Width」にページの幅を入力。
2. 「Columns」にカラムの数を入力。
3. 「Gutters」に溝の幅を入力。
4. 以上で入力作業は終了で、「Save」をクリックするとグリッドが生成されます。
5. HTMLとCSSは、各ボタンをクリックすると生成されます。

レイアウト画面ではヘッダ・コンテンツ・フッタが配置されており、それとは別に任意で設定したパネルを配置することも可能です（上キャプチャのグレー箇所）。