« ツールチップをリンクの要素にマウスオーバーさせるjQueryのプラグイン | トップページ | table要素の行をソートさせるjQueryプラグイン「table sorter」 »

2011年1月17日 (月)

画像を使用しないで、ボックスの影をcss表現する方法 その2

前回のCSS3記事に引き続き、画像を使用しないでボックスに影を表現する方法のご紹介です

Css_shadow_002

デモページ

前回の記事と同じく、擬似クラスのbeforeとafterを利用し影を表現しています。
設定によって様々なパターンの影を表現できると思います。

画像を使用しないで、ボックスの影を表現する方法 その2解説編に続きます。

|

« ツールチップをリンクの要素にマウスオーバーさせるjQueryのプラグイン | トップページ | table要素の行をソートさせるjQueryプラグイン「table sorter」 »

css」カテゴリの記事

コメント

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.f.cocolog-nifty.com/t/trackback/1378074/38495813

この記事へのトラックバック一覧です: 画像を使用しないで、ボックスの影をcss表現する方法 その2:

« ツールチップをリンクの要素にマウスオーバーさせるjQueryのプラグイン | トップページ | table要素の行をソートさせるjQueryプラグイン「table sorter」 »