Home > デザイン系 > CSS

CSS Archive

フリーのフォトショップブラシやプラグイン配布サイト「PHOTOSHOP MOSAIC」

http://www.photoshopmosaic.com/

photoshop-mosaic2

個性的なブラシやパターン満載。ハートのブラシもひとひねりあるデザイン。

50の美しくてユーザーフレンドリーなナビゲーションメニュー選

http://www.smashingmagazine.com/2009/02/04/50-beautiful-and-user-friendly-navigation-menus/

相変わらず、SMASHING MAGAZINEはネタが豊富。

CSSやJSを利用したナビゲーションの面白いアイデアが掲載されています。
どれも個性的で、デザインだけでなく動作も洗練されているので、応用しだいで素敵なナビゲーションデザインができそう。

ten

ph

nopoko

CSSでデザインするスタイリッシュなフォームデザイン

http://www.webmonkey.com/tutorial/Stylize_Forms_With_CSS

フォームをデザインする際の汎用的なマークアップ、CSSの記述の仕方がチュートリアルとしてまとまっている。

jQuiryを使用したブログのテーマビルダー

http://ui.jquery.com/themeroller/

いわゆるテーマビルダー。

フォーム内の値を変更することで、オンラインで新しいテーマを作成でき、出来上がったテーマファイルは、ZIPでダウンロードできる。

サイトのテーマをいくつも作成したいときなどに、基本データをこれで作っていくとよいかも。

CSSで作るテーブルレイアウトトップ１０

http://www.smashingmagazine.com/2008/08/13/top-10-css-table-designs/

CSSベースなので、応用して使えそうです。

サンプルからCSSレイアウトを選んでカスタマイズできるdo template

http://www.dotemplate.com/

サンプルのテンプレートがプロ仕様で画像もついているのでイメージしやすい。
サイト内のフォームから入力指定でカスタマイズできるので◎

Nice and Free CSS Templates

http://mycelly.com/

2カラムからセンター配置まで、シンプルだけど使い勝手の良いCSSレイアウト集。
12種のサムネイルから好きなCSSテンプレートをDLできる。

フォーム入力していくと、CSSレイアウトが作成できるサイト

http://www.positioniseverything.net/articles/pie-maker/pagemaker_form.php

使える！42のCSSレイアウトベース集

http://www.code-sucks.com/css%20layouts/faux-css-layouts/

 

42種ものレイアウトベースがあるので、WEBデザインで使用するおよそのパターンに対応可能です。

CSSレイアウトのチート集12

http://www.zachgraeve.com/css-cheats/

汎用レイアウトのHTML&CSSソースが公開されています。

これを元に使えば、制作作業が効率かできます。
使いたいレイアウトをクリックして選んだ後、左上の「View Souce」でソースを表示させ、コピペします。HTMLとCSSは1つのソースになっているので、CSSを別ファイルにして、リンクを貼ればＯＫ！

ホーム > デザイン系 > CSS

Pages
Recent Entries
Categories
Archives
Tag Cloud
Search
Feeds
Meta

Return to page top