CSSフォームのボタンについては以前、buttonタグにボタン画像をそのまま入れるという手法を書きましたが、もう一つ、ボタンの見た目をCSSで変更する手法がございます。この記事ではCSSでスタイリッシュなフォームボタンを作る方法について解説します。メリットとしては、ロールオーバーアクションをCSSで制御出来るという点と、タイプ属性にimageを指定しないので、送信やリセットなどの機能を殺さないという点があります。CSSでのロールオーバーはIE6未対応なので、気になる方はJavascriptと併用してください。上がマウスアウト、下がマウスオーバーになるよう、繋げて作る。CSS上記の画像を基にしたスタイルシートです。上記CSSに書いてある以下のプロパティはIE対策です。0px;コレがないとボタンが表示されないばかりか、text-indentをマイナスにしている場合にウィンドウが横に伸びるというような事態に陥ります。画像を背景だけにして文字を表示する場合は、text-indent:0、font-size削除か任意の値、line-heightはheightと同じ値にすればOK。コメントデータの処理方法の詳細はこちらをご覧ください。キャンセル投稿を送信できませんでした。メールアドレスを確認してください。メール送信チェックに失敗しました。このブログではメールでの投稿共有はできません。