前提

CSS3 の登場で、いろんな CSS のトリックを使ったエフェクトが考えられてます。まだまだ CSS3 に非対応のブラウザも多いので、全てを CSS3 で表現する訳にはいかないのが現状ですが、私的には積極的にどんどん取り入れていきたいなーとも思ってます。
海外ブログなどで、色んな CSS3 を使った Tips が紹介されているので、その中からいくつかご紹介します。どれもサンプルを作って試してみたものばかりです。以下の環境で動作確認もしています。
Mac : firefox、Safari、Chrome
Win : firefox、IE8、Safari、Opera、Chrome

画像ホバー時にオーバーレイ – CSS3

画像にリンクが貼られている時など、マウスを乗せたときにアイコンなどを表示します。リンクが貼られているかどうかが一目で分かるので、ユーザーフレンドリーなデザインだと思います。今回は CSS3 っぽく、アニメーション（フェード）を使ったオーバーレイをご紹介。