コメントするボタンを画像に

コメントするボタンに画像を使ってみます・・

まずは画像を用意します・・・（お持ち帰り自由）














あとはＣＳＳの最後に・・・


/*コメントボタン*/
.commentBtn{
width:250px;/*画像の横*/
height:80px;/*画像の縦*/
background-image:url(画像のＵＲＬ);
background-repeat:no-repeat;
background-color:transparent;
border:none;
text-indent:-9999px;
}
.commentBtn:hover{/*マウスオーバー時*/
background-image:url(画像のＵＲＬ);
}

ロールオーバー（マウスがのったときに画像を変える）しない場合は水色部分は削除します
画像のＵＲＬが入っていない状態でそのままですとマウスがのったら画像が消えちゃいます
上と同じ画像のＵＲＬを入れるか水色部分を削除して下さい