WebbappersにMac-like Multi-level Dropdown Menu with CSS3という記事がポストされていましたので、ちょっとだけ紹介します。
簡単に言うと、CSS3を使ってappleみたいなカッチョイイドロップダウンメニューをつくちゃおうぜ!ってことです。
CSS3には、ものすごーーーーく期待しているので、ドンドン広がっていって欲しいですね。

CSS3でドロップダウンメニュー
WebbappersにMac-like Multi-level Dropdown Menu with CSS3という記事がポストされていましたので、ちょっとだけ紹介します。
簡単に言うと、CSS3を使ってappleみたいなカッチョイイドロップダウンメニューをつくちゃおうぜ!ってことです。
CSS3には、ものすごーーーーく期待しているので、ドンドン広がっていって欲しいですね。

CSS3でドロップダウンメニュー
ウチの新人にページをつくらせた時に、ボクがいった言葉です。
どういった状況かというと、いっちょまえにfloatを使って2カラムのページをコーディングしていたんですね。
心の中で「ほほー」と思っていたんですが、floatの最後にdivが入っている。div? DIV?
「ちょっと待て!お前Floatの解除おかしいぞ?」となったわけです。
Continue Reading »
前回の記事で「IEでも透過pngやmin_heightとかモダンブラウザみたいにやってみよう」を書きましたが、
今回は、もう少し突っ込んでIEでもCSS3の擬似セレクタを適応させるjavascriptライブラリの「
ie-css3.js (v0.9.4b)」を紹介。
Continue Reading »
CSS3のtransitionを使って、面白いことをやってみます。
ちょっと説明が難しいのですが、ちょっとしたサブメニューやクリックしてもらいたいボックス要素があるとします。
何気なくオンマウスしたときに、ボックス要素が拡大回転しながら背景色が変わっていくテクニックで、ちょっとしたサプライズ的に使えます。
残念なのはfirefox3.5では動作しませんでしたが、将来的に対応するみたいです。IEは当然ダメダメです。
PHPSPOT開発日誌さんに「CSSのrotationを使った時計「CSS Clock」」という記事がポストされました。
これがなんとも!メチャめちゃかっちょいい!このまま壁にかけてもクール!な時計です。
プロダクトとしても秀逸。これがCSSだなんて・・・なんてすてきな未来なんでしょう・・。
HTML5を勉強しておきたい!そんな方のため非常にシンプルなテンプレートがありましたので紹介します。
このテンプレートはシングルカラムで、header・aside・section・footerだけの非常にシンプルな構成となっています。
さらにCSS3のradiusで角丸も実現しています。
このシンプルなテンプレートで、いち早くHTML5+CSS3を手に入れておきましょう。
Continue Reading »
CSS3で角丸とかドロップシャドウなどの表現がラクチンになったんですが、
プロの現場ではそうでもなかったりします。
IEはCSS3をほとんど(まったく?)受け付けません。もうね、意地になっているんじゃないか?と思うほど。
そんなIEに角丸とドロップシャドウを適応させるCSSテクニックを紹介します。

Continue Reading »
前回のポスト「HTML5+CSS3で作られたテンプレート」でも、ちらっと紹介しましたが、Kruz-GraphixでもCSSで角丸を表現しています。
今回はCSS3で角丸とボックスの影の表現の説明します。
まぁ、ググれば(google)いくらでも出てきますがねww。
Continue Reading »