- 2007-05-08 (Tue) 9:05
- その他
クリックするとボタンがへこみ、さらにラベルのテキストが1px下がってくれる、というちょっと凝ったエフェクトがかかったボタンの作り方が紹介されていました。
簡単な画像とCSSで実現できますよ。

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

↑ このようなエフェクトがかかります。
詳しい設置の方法は以下からどうぞ。ちょっとした小技ですが、知っておくと便利ですね。
- Newer: その記事が何日前に更新されたのかを教えてくれるインターフェース
- Older: 各種地図サイトにみる「印刷するときにちょっと便利な機能」
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とか使わないと好きな場所(画面の右側とか)に作れないのが残念。
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 ~ ウェブ職人のための小粋なネタ帳
