札幌Web制作のシンクグラフィカ

送信ボタンのデザインについて

佐山さん (2016-07-19 16:17:04) house.osouji-h.com/inquiry

独自の画像を送信ボタン・リセットボタンに使用したのですが、
マウスを重ねると、ボタンのまわりに青いグラデーションが表示されます。
mailformpro.css の、
「.mfp_element_submit:hover,.mfp_element_reset:hover,.mfp_element_button:hover」
の記述箇所をコメントアウトして、ボタンのまわりの青いグラデーションは消えたのですが、このような方法で大丈夫でしょうか?

また、ボタンのまわりの青いグラデーションは消えたのですが、新しく設定したボタン画像の下(背景)に、元のデザインのグレーのボタンが表示されてしまいます。
この初期設定のグレーのボタンそのものを表示させないようにすることは出来ないでしょうか?

Re:送信ボタンのデザインについて

和田 (2016-07-25 13:19:28) www.synck.com

ボタンまわりのスタイルはすべてmailformpro.css内に記載されていると思いますのでコメントアウトでもよいですし削除しちゃっても大丈夫です。擬似クラスのhoverもついているので、hoverの方も消していただくことで改善するものと思います!

Re:送信ボタンのデザインについて

佐山さん (2016-10-08 01:18:41) house.osouji-h.com/inquiry

ご返事が遅くなりました。
申し訳ございません。
ボタンデザインの記述場所がわかりました。
mailformpro.css の
「.mfp_element_submit,.mfp_element_reset,.mfp_element_button」
で、ボタンが作られていましたが、ここはコメントアウトすると、
送信前の確認画面でのボタンデザインにも影響しましたので、
コメントアウトは諦めました。
初期状態のボタンデザインのままで使用させていただきます。
最後になりましたが、ご返事いただき、ありがとうございました。

Re:送信ボタンのデザインについて

和田 (2016-10-10 18:01:24) www.synck.com

確認画面のボタンとフォームのボタンはたしかIDを分けていたはずなので調整することはできたと思いましたよっ!どうやってやるかは忘れましたけどねっ!

Re:送信ボタンのデザインについて

佐山さん (2016-10-10 21:56:51) house.osouji-h.com/inquiry

ご返事いただきまして、ありがとうございます。
id が違うんですね。
もう少し、くわしく確認してみます。

Re:送信ボタンのデザインについて

和田 (2016-10-11 10:45:12) www.synck.com

細かいIDなどはブラウザのWebコンソール機能などを利用して調べていただくと便利です!なんかすいません不親切で!