街中で見かけて「グッときた人」の思い出

困ってます。

”送信 クリアボタン”
<input type="submit" value="送信" name="B1"><input type="reset" value="リセット" name="B2">

これを2つの画像にした場合、送信アイコン、クリアアイコンにはどう記述すればOKでしょうか?
困ってま~~~~す。

A 回答 (4件)

すみません。

間違いがありました。
お気づきかもしれませんが、
<button>のスタイルシートの記述のところが、
backgraund ではなく background です。

>資料請求のボタンをアイコンに変えるのですが....
大丈夫でしょうか?

大丈夫、というのは何に関してでしょうか?
スクリプトの動作に関してであれば、
スクリプトがちゃんと記述されていれば問題ありません。
ボタンの表記が画像ファイルを使用した形式に変わるだけですから。
(スクリプトの種類によっては、ブラウザに依存してしまいますが)

ただ、ボタンの表記そのものがブラウザ上どこまでカバーできるかという
問題はあります。
がんばってください(^ー^)
    • good
    • 0

<button>タグとスタイルシートを使用した方法があります。


スタイルシートを使用するため、(またこのタグ自体)ブラウザへの依存は免れませんが。
苦肉の策といった感じですので、あまり実用性はないかもしれません。

記述の仕方は以下の通りです。
type属性には、<input>と同様の、submitとresetに加えて、buttonの3種類があります。
<button type="submit">
<img src="画像ファイル名">
</button>

<button type="reset">
<img src="画像ファイル名">
</button>

これだけですと、
画像の周りにボタンが余る形になり(←意味不明。ご興味あればお試しください)、
美しくないので、
スタイルシートを使って、
<button type="submit" style="border-style:none;backgraund:transparent">
<img src="画像ファイル名">
</button>
のように、ボタンの枠を消し、背景色を透明にします。
ただ、ボタンをクリックしたときにボタンの枠は表示されてしまいますが。

こんなのもあるよ、というものですので、
あまりお勧めはできませんが。
    • good
    • 0
この回答へのお礼

ありがとうございます。
早速試してみます.......
資料請求のボタンをアイコンに変えるのですが....
大丈夫でしょうか?

お礼日時:2002/02/27 08:54

JavaScript を使うと、submit や reset を、type に指定したボタンを押さずとも好きなときに


実行することが出来ます。

<form name="f" ...> <!-- このフォームの名前を f とします -->
<!-- これが「送信」 -->
<a href="javascript:document.f.submit()"><img src="送信の画像"></a>
<!-- これが「リセット」 -->
<a href="javascript:document.f.reset()"><img src="リセットの画像"></a>
</form>

# 直接関係ない form の action や、入力のための input は省略していますので、注意して
    • good
    • 0
この回答へのお礼

ありがとうございます。
早速試してみます.......
資料請求のボタンをアイコンに変えるのですが....
大丈夫でしょうか?

お礼日時:2002/02/27 08:53

送信↓


<a href="javascript:check_click();">
<img src="送信画像名.gif" width="80" height="30" border="0"></a>

クリア↓
<a href="この画像を載せているページ.htm">
<img src="クリア画像名.gif" width="80" height="30" border="0"></a>

※クリアは何て事のない、同じファイル名にリンクを張れば、再度読み直すのでクリアと同じ事です。難しく考えると、はまりますよね。
    • good
    • 0
この回答へのお礼

ありがとうございます。
早速試してみます.......
資料請求のボタンをアイコンに変えるのですが....
大丈夫でしょうか?

お礼日時:2002/02/27 08:53

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!