2012年

7月

31日

099 Webクリエイターボックス

cssでネストに困ったときに、Sassという書き方があるらしいです。

親要素をいちいち書かなくて済むので、短くなって効率アップしますね。

 

0 コメント

2012年

7月

31日

097 UI Parade

CSSでつくるボタンやフォームのジェネレーター。

サイトのデザインがシンプルでかわいいです。

0 コメント

2012年

7月

30日

091 net tuts+

cssのborderで表現できることがまとまってます。

吹き出しの三角形の部分を作るのとか勉強になるなあ。

0 コメント

2012年

7月

30日

087 CSS Animations

CSS3で表現されたフォントのアニメーションいろいろです。

DEMO1が使えそうですよ。

0 コメント

2012年

7月

27日

074 Animated Circle gallery

画像をマウスオーバーしたときに、写真がゆっくりと挙動するCSSです。表現豊かですねー。時間があったら導入してみたいです。コードはこの辺。

-webkit-transition: all 1.5s ease;
-moz-transition: all 1.5s ease;
-o-transition: all 1.5s ease;
-ms-transition: all 1.5s ease;
transition: all 1.5s ease;

 

0 コメント

2012年

7月

27日

069 WebDesignShock

ほんとにこの記事はすごい!CSS3の表現の世界はここまで広がったと思い知らされるまとめです。気に入ったのは上から3番目のFading〜。下からうにょーんって赤いボタンが出てくる。用途は分からないが、表現としては斬新ですね。

0 コメント

2012年

7月

24日

059 Parallax Effect

jQueryじゃなくてCSSで表現しているみたいです。

この手のCSS3って解読するのが難しいんだよなあ。

0 コメント

2012年

7月

24日

055 WEBEXPEDITION18

PianoをCSS3で表現しているのがすごい!

しかもクリックした時に鍵盤が下に押されて影ができるのも見事に表現。

CSSは500行の大作。

0 コメント

2012年

7月

23日

051 stroll.js

CSSの表現で久しぶりに感動しました!

スクロールでこんな表現できるなんて!

0 コメント

2012年

7月

23日

042 Image Accordion with CSS3

改めてCSS3でこのように表現できるコーダーさんを尊敬します。

といっても、3はブラウザ対応が不十分なので早くその時が来て欲しいと願っています。

jsでかける範疇ですが、文書構造はHTML・デザインはCSSと役割で分けるのが本来の使い方だと思うので。

0 コメント

2012年

7月

18日

020 AWWWARDS

CSS3でつくられたDEMO、ジェネレーターとかのまとめです。

 

パターンのギャラリーすごいです。

画像で作られているのかと思ったら、パターンですらCSS3で作られていました!

0 コメント

2012年

7月

18日

017 InsertHTML

え!cssで画像にフィルターかけられたの!!??知らなかった。

どんだけ万能なんだ、3は。

しかもwebkitだけ・・・

 

0 コメント

2012年

7月

18日

013 web designer wall

検索ボックスをクリックすると、うにょーんって伸びるやつ。

アップルも使ってます。

0 コメント

2012年

7月

18日

012 WebDesignShock

before after擬似クラスでつくる、イメージボックスの様々な表現。

勉強になるなあー。

0 コメント

2012年

7月

17日

006 WD

CSS3とjQueryで再現されるタブ集。

かっこいいデザインが多数あります。

デモがリンクページでみれないのが残念!

0 コメント

2012年

7月

17日

003 instantShift

CSS3で表現した、アニメーションボタンです。

すごいヌルヌルした動きで気持ち悪いのが多いです。

リンクを踏まないでコードが閲覧できるのがいいですね!

0 コメント

2012年

7月

17日

002 Animate.css

CSS3で表現できるアニメーションのポートフォリオです。

挙動のボタンワンクリックで、デモが確認できる素晴らしいサイトです。

0 コメント