[新着] Webテンプレートを仮オープンしました
inputタグに type="image" を指定すると、画像を使った送信ボタンを作成できます。
<input type="image" src="button.gif" alt="送信">
<input type="image" src="button.gif" alt="送信" align="right">
| src="" | 読み込む画像のファイル名を指定します |
|---|---|
| alt="" | 代替テキストを指定します |
| align="" | 画像に並ぶ文字の位置を指定します |
■alt="" （代替テキストを指定する）
画像の代わりになるテキストを指定します。
詳しくは、イメージタグの「画像の代わりになるテキストを指定する」をご覧ください。
■align="" （画像に並ぶ文字の位置を指定する）
画像に並ぶ文字の位置を指定します。
詳しくは、イメージタグの「画像に並ぶ文字の位置を指定する」をご覧ください。
※この属性は、HTML4.01では非推奨とされています。
【送信ボタンが複数ある場合】
状況によっては、複数の送信ボタンを使用する場合があります。（押されたボタンにより処理を振分ける場合など）
このような場合には、各送信ボタンに name="" を追加して、それぞれのボタン名を指定します。
【座標の送信】
画像を使った送信ボタンをクリックすると、クリックした位置（座標）が送信されます。
■送信される形式
（例1） x=25 y=10
（例2） ボタン名.x=25 ボタン名.y=10 … ボタン名を指定している場合
次のボタン画像をクリックすると、ブラウザのアドレスバー内のURL（末尾）に座標が表示されます。
<form method="GET" action="example.cgi">
<input type="image" src="image/button.gif" alt="送信">
</form>
▼これをブラウザで見ると次のように表示されます
※サンプルのため送信できません
■複数のボタンがある場合
<form method="GET" action="example.cgi">
<input type="image" src="image/b01.gif" name="button_a" alt="Aボタン">
<input type="image" src="image/b02.gif" name="button_b" alt="Bボタン">
<input type="image" src="image/b03.gif" name="button_c" alt="Cボタン">
</form>
▼これをブラウザで見ると次のように表示されます
※サンプルのため送信できません
