[B! CSS3][FORM] keijixのブックマーク

CSS3とjQueryでフォームを美しく装飾する方法

2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです！そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト！フォームの仕様今回チャレンジするフォームの主な仕様です！グラデーション・ボックスシャドウを使って立体感を表現角丸で丸みをつける（モダンブラウザ）対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ？という人もひとつひとつ記述していけば意外と簡単に作れるはずです！リンクをクリックで各項目にジャンプします。テキストボック

keijix 2010/10/27

リンク

CSS3で作るクールなお問い合わせフォーム – creamu

フォームをCSS3で作りたい。そんなときに参考になるのが、『Create A Clean and Stylish CSS3 Contact Form』。CSS3で作るクールなお問い合わせフォームです。角丸やグラデ、シャドウなどをCSSで指定していますね。デモは以下から。 LIVE DEMO ソースもダウンロード可能ですね。 CSS適用前と適用後の解説がわかりやすいので、一度見てみてください。 Create A Clean and Stylish CSS3 Contact Form またかなり久々になってしまった・・・・。納品とかサーバトラブルが重なってえらいことになっていました。7月もかなり詰まっているんですが、がんばっていきたいと思います。

keijix 2010/10/25

リンク

CSS3を使用した美しいフォームが簡単に作成できる -FAARY

CSSやHTMLの知識がなくても簡単にCSS3を使用した美しいフォームが作成できるオンラインサービス「FAARY」を紹介します。 FAARY - Free, Online CSS Form Generator 「FAARY」の利用は無料で、登録など面倒なことは一切無しで利用ができます。フォームの作成・ダウンロードはわずか3ステップで完了です。フォームの内容を設定「Generate!」ボタンで、フォームが生成あとは、ダウンロードするだけフォームは日本語にも対応しており、内容を設定するする際に日本語の利用が可能です。

keijix 2010/04/01

リンク

Design a Prettier Web Form with CSS 3 | Envato Tuts+

Thanks to advanced CSS properties, such as gradients and shadows, it’s now quite easy to turn a dull web form into something beautiful – with minimal effort. I’ll show you how in today’s tutorial! This tutorial includes a screencast available to Tuts+ Premium members. Subtle background gradients give depth to the fields while shadows lift them from the page. Even more impressive is that this is do