Home > 便利ツール > WYSIWYGでCSSレイアウトを超簡単に作れる『CSS Grid Builder』

WYSIWYGでCSSレイアウトを超簡単に作れる『CSS Grid Builder』

2006-12-15 (Fri) 9:25
便利ツール

なにかと便利なYahoo!のUIライブラリーに「Grids CSS」なるものがあります。自分でつくると面倒なCSSのレイアウトをテンプレートで提供してくれるものです。
この「Grids CSS」、ブラウザ対応がしっかりしていたり、ファイルサイズが軽量だったり、テンプレートが豊富だったりといいことづくめですが、いざ使うとなるとそれなりに説明を読み込んで（簡単だけど）手作業でレイアウトをつくっていく必要があります。
そこでその作業を簡単にできるようにWYSIWYGでジェネレーターを作った方がいます。こいつは便利です。
» YUI: CSS Grid Builder

↑ コントロールパネルはこんな感じ。
プレビューを見ながらカラムの数や横幅を指定していくと簡単にレイアウトができちゃいます。もちろんコードも瞬時に生成してくれます。
なお、これを使うには当然ですがYUIが必要になります。ダウンロード＆説明は以下をどうぞ。
» Yahoo! UI Library: Grids CSS
CSSのレイアウトハックなんかを紐解いていた時期が懐かしいですね・・・いい時代になったものです。

Comments:2

高江洲　義二 06-12-16 (Sat) 16:31: どうも、初めまして。CSS Grid Builderの使用方法がわからない。英語のVideo説明を見たが、まだはっきりしないです。どこのサイトから、そのsoftか、又は、コードをコピーして、何処の自分のサイトのどの部分に貼り付ける（コピー）のか＞？。いわゆる、簡単に写真を取りはずしたり、移動したり出来る事が簡単に出来るsoft　ですか？
hibikicco 06-12-22 (Fri) 2:45: 管理人ではありませんが、お返事を。
CSS Grid Builderは、Yahoo!が提供してくれているライブラリを利用して、直感的にCSS（カスケードスタイルシート）を簡単に生成するものです。
ちなみにCSSとはWEBサイトのデザインを制御するものです。HTMLのように手打ちもできますが、綺麗に作るにはそれなりの知識が必要ですので、CSS Grid Builderは便利、ということかと。