<input type=image>は、画像ボタンを表す際に使用します。
input要素のtype属性の値に image を指定すると、画像によるフォーム送信ボタンを表します。 Image Button状態のinput要素は、フォーム送信ボタンの役割を果たす画像です。 その画像内の座標をユーザーが選択するとフォーム送信されます。
Image Button状態のinput要素によってフォーム送信される場合、 フォーム送信の際にユーザーが選択した画像内の座標(x, y)を取得できます。 座標は、画像の左上端を (0, 0) とした場合の相対的な位置を表し、x座標は右方向に正、y座標は下方向に正となります。
input type=imageの場合、src属性は必須です。 src属性の値には、画像リソースを参照する有効なURLを指定します。 src属性の値に空文字は指定できません。
input type=imageの場合、alt属性は必須です。 alt属性の値には、画像が利用できない場合に使用する置換テキストを指定します。 alt属性の値として適切なテキストは、画像が利用できない場合に画像と同等の役割を果たす、 ボタンに適切なラベルを与える文字列です。 alt属性の値に空文字は指定できません。
input type=imageの場合、width属性とheight属性で 画像がレンダリングされる幅と高さを指定できます
formaction属性、formenctype属性、formmethod属性、formnovalidate属性、formtarget属性は、 フォーム送信コントロールに使用する属性です。
input type=imageの場合、value属性は省略する必要があります。
以下のサンプルは、input要素のtype属性の値に image を指定して画像ボタンを作成しています。 例えば、ユーザーが画像の中心をクリックした場合、 送信先URLには「?where.x=150&where.y=50」という具合に選択した座標が付加されます。 ユーザーが画像のどの位置をクリックしたかによって、送信結果を振り分けることもできるでしょう。
<form action="#sample1" id="sample1">
<input type=image src=./sample/where.png name=where alt="画像のどこを選択したか?">
</form>