[CSS]フォームの新規開発と既存カスタマイズ用のフレームワーク -Formee
Post on:2010年5月14日
クロスブラウザ対応で、あらゆるデザインに柔軟に対応可能なフレキシブルでカスタマイズに優れたフォームのフレームワークを紹介します。
![デモのキャプチャ](/wp-content/uploads-2010/2010051401.png)
Formee - Fresh baked forms for your websites!
デモページ
Formeeは新規にフォームを作成する際だけでなく、既存のものをカスタマイズする際も想定して作成されたフレームワークです。
既存のフォームのセレクトボックスを下記のようにスタイリッシュに変更することも簡単です。
![デモのキャプチャ](/wp-content/uploads-2010/2010051408.png)
セレクトボックスのデモ
Formeeのデモ
デモページではFormeeで実装したフォームの各エレメントを確認することができます。
![デモのキャプチャ](/wp-content/uploads-2010/2010051402.png)
フォームの各エレメントのデモ
![デモのキャプチャ](/wp-content/uploads-2010/2010051403.png)
960px、12グリッドに配列したデモ
![デモのキャプチャ](/wp-content/uploads-2010/2010051404.png)
ログイン、登録のデモ
![デモのキャプチャ](/wp-content/uploads-2010/2010051405.png)
メッセージボックスのデモ
![デモのキャプチャ](/wp-content/uploads-2010/2010051406.png)
ユーザー登録のデモ
Formeeの使用方法
Formeeを利用するには、CSSファイルを二つ外部ファイルとして記述するだけです。
1 2 3 4 |
<textarea name="code" class="html" cols="60" rows="5"> <link rel="stylesheet" href="css/form-structure.css" type="text/css" media="screen" /> <link rel="stylesheet" href="css/form-style.css" type="text/css" media="screen" /> </textarea> |
あとは、フォームにクラスを適用するだけで簡単にスタイリッシュなものになります。クラスは下記ページを参照してください。
Formeeリファレンスガイド
sponsors