CSS 熱

On April 13, 2008, in Web, by ryos

ベイエリア暑すぎだよ。この温度の変動のえげつなさは流石海沿いとしか言いようがありません。ま、そんな事はどうでもいいのですが・・・。

昔はだいっきらいな Dreamweaver でしたが、それでも Web 開発者として知らなきゃならんだろうと思い、たかしさんに社割で購入していただいた CS3。それでもしばらくは TextMate のせいで放ったらかしを喰らってました。(だって Ruby on Rails の開発には TextMate の方が断然らくなんだもん。)でも最近静的サイトのデザインが重なってちょっと DW 使いだしてます。結構それなりにワークフローが身についてきたので楽しい!

さて Dreamweaver 話ついでにちょっと Web 開発ネタ。実は最近自分の中で CSS がアツいです!特に Microsoft が IE7 で様々なコンパチビリティ問題をなおしてくれたお陰でスタンダード CSS 2.1 が3大ブラウザー(Firefox、Safari、そして IE)で共通に動いてくれる時代がついに到来?!僕は CSS はしばらく触ってなかったので勉強がしら ryosode.com のホームページを書き直してみました。

今回は世の中結構ちょっとインタラクティブなサイトUIを作ろうとするとすぐに JavaScript や Flash に目がいってしまいがちですが、CSS だけでも結構色々出来る事ってある事を再確認しました。(結構 Web エンジニアの人でも rollover ボタンは JavaScript でしか作れないと思っている人が多いです!)

まだ開発途中ではありますが、http://ryosode.com のホームページに行っていただくと結構 JavaScript を使わずともシンプルな XHTML 構造のページを CSS だけでいやらしくいじくれる事をご理解いただけるのではないかと思います。(っていうかうるさすぎ?すんません・・・。)

例えば IE6 では :hover 機能は a (anchor) タグにしか使えませんでしたが、IE7 ではきちんと他のタグに対しても使えるようになりました。これを visibility パラメターと組み合わせる事でマウスの位置によって様々な HTML エレメントを見せたり隠したりできるんです。

そんなこんなでまた CSS アツいんで、しばらく遊んでみようかと思います・・・。

マウスがブラウザウィンドウの外にある時は・・・

いったんマウスをブラウザの中にもっていくと・・・・

Share and Enjoy:
  • Digg
  • Facebook
  • del.icio.us
  • StumbleUpon
  • Tumblr
  • FriendFeed
  • NewsVine
  • Technorati
  • LinkedIn
  • RSS
  • PDF
  • Google Bookmarks
Tagged with:  

3 Responses to “CSS 熱”

  1. ryos says:

    iPhone 用に別 CSS 用意しなきゃ・・・。

  2. takashi says:

    こんなのも、御座います。

    http://rubyweaver.gilluminate.com/

  3. ryos says:

    お、こんなのあるんすね。今セットアップしてみました。Ruby on Rails ベースのサイトのデザイナーの人には重宝しそうなソリューションですね。layout ファイルとか作るのにはもってこいかも。

    でもなんで .erb ビューテンプレートファイルの中にエンベッドされている ruby コードの部分を Design ビューで見ると ASP って書いてあるアイコンが出てくるんでしょう?