Home > その他 > CSSと画像でちょっと凝ったエフェクトがかかったボタンを作る方法

CSSと画像でちょっと凝ったエフェクトがかかったボタンを作る方法

クリックするとボタンがへこみ、さらにラベルのテキストが1px下がってくれる、というちょっと凝ったエフェクトがかかったボタンの作り方が紹介されていました。

簡単な画像とCSSで実現できますよ。

css_button_1.gif

↑ このようなボタンをクリックすると・・・。

css_button_1.gif

↑ このようなエフェクトがかかります。

詳しい設置の方法は以下からどうぞ。ちょっとした小技ですが、知っておくと便利ですね。

» How to make sexy buttons with CSS

@taguchiをフォロー!
Twitterもやっています!

Comments:3

too-ri-soo-girl 07-05-08 (Tue) 11:28

二つとも、
http://www.simplexsimple.com/archives/2007/05/08/css_button_1.gif
になってますが…。

too-ri-soo-girl 07-05-09 (Wed) 10:26

画像、早々に直していただけたようで。
ただ、alt属性が、css_button_2.gifではなく、css_button_1.gifのままのようです。粗探しばかりしてごめんなさい。

koinarisan 08-01-26 (Sat) 17:46

このボタンって左寄せになってしまうんですよね。tableとか使わないと好きな場所(画面の右側とか)に作れないのが残念。

Comment Form
Remember personal info

Trackbacks:0

Trackback URL for this entry
http://www.simplexsimple.com/archives/2007/05/css_2.html/trackback
Listed below are links to weblogs that reference
CSSと画像でちょっと凝ったエフェクトがかかったボタンを作る方法 from SIMPLE*SIMPLE ~ Web職人のための小粋なネタ帳

Home > その他 > CSSと画像でちょっと凝ったエフェクトがかかったボタンを作る方法

最近の記事
カテゴリー一覧
過去記事一覧

Return to page top