Visualforceのボタンについてのあれこれ

VisualforceのボタンのStyleについてちょっと調べたのでログ

・ボタンを＜apex:commandButton＞で設置すると、Salesforce標準のCSSが適用されてしまう。

方法1：＜apex:page＞のstandardstylesheets属性をFalseに設定する
方法2：勝手に適用されたCSSのclassを何かしらの方法で削除する
方法3：HTMLでボタンを作って、＜apex:actionFunction＞などを使う

・マウスオーバーした際に、ボタンをへこませたりしたい。

＜apex:commandButton>のonMouseover属性、onMouseout属性を設定する。

<apex:commandButton image="{!URLFOR($Resource.SampleResourse, 'SampleResourse/images/btn_off.png')}"
                    alt="ダウンロード"
                    styleClass="button1"
                    onMouseover="this.src='{!URLFOR($Resource.SampleResourse, 'SampleResourse/images/btn_on.png')}'"
                    onMouseout="this.src='{!URLFOR($Resource.SampleResourse, 'SampleResourse/images/btn_off.png')}'"/>

image属性：初期表示時の画像(通常)
onMouseover属性：マウスオーバー時の画像(へこむ)
onMouseout属性：マウスオーバー後の画像(通常)

onMouseout属性で、通常の画像に戻してあげるのを忘れない。

ボタンに画像は使わない派だったけど、実際作ってみると楽しい。
デザイン系の仕事もやってみたいなあ。