<input type="image"> …… 画像ボタンを作成する
<input>タグのtype属性の値にimageを指定すると、画像ボタンを作成します。 画像ファイルはsrc属性で指定します。画像ボタンにはalt属性が必須となります。
■type="image"の場合に指定可能な属性
type="image"
画像ボタンを作成する
name属性
ボタンに名前をつける
value属性
ボタンの値を指定する
src属性
ボタンに使用する画像ファイルのURIを指定する
alt属性
type="image"の場合に、画像の代替テキストを指定(type="image"の場合には必須属性)
height属性
type="image"の場合に、画像の高さを指定
width属性
type="image"の場合に、画像の幅を指定 HTML5から追加
formaction属性
送信先URLを指定 HTML5から追加
formenctype属性
送信するデータの形式を指定(application/x-www-form-urlencoded・multipart/form-data・text/plain)(初期値はapplication/x-www-form-urlencoded) HTML5から追加
formmethod属性
送信方法(HTTPメソッド)を指定(get・post)(初期値はget) HTML5から追加
formnovalidate属性
入力されたデータの妥当性を確認しない(formnovalidate) HTML5から追加
formtarget属性
フォーム送信するターゲット先を指定(_blank・_self・_parent・_top・任意のターゲット名) HTML5から追加
画像ボタンを作成する
name属性
ボタンに名前をつける
value属性
ボタンの値を指定する
src属性
ボタンに使用する画像ファイルのURIを指定する
alt属性
type="image"の場合に、画像の代替テキストを指定(type="image"の場合には必須属性)
height属性
type="image"の場合に、画像の高さを指定
width属性
type="image"の場合に、画像の幅を指定 HTML5から追加
formaction属性
送信先URLを指定 HTML5から追加
formenctype属性
送信するデータの形式を指定(application/x-www-form-urlencoded・multipart/form-data・text/plain)(初期値はapplication/x-www-form-urlencoded) HTML5から追加
formmethod属性
送信方法(HTTPメソッド)を指定(get・post)(初期値はget) HTML5から追加
formnovalidate属性
入力されたデータの妥当性を確認しない(formnovalidate) HTML5から追加
formtarget属性
フォーム送信するターゲット先を指定(_blank・_self・_parent・_top・任意のターゲット名) HTML5から追加
■使用例
HTMLソース
<form action="cgi-bin/abc.cgi" method="post">
<p>
名前:<input type="text" name="namae">
</p>
<p>
<input type="image" src="images/kaeru.png" alt="押してケロ♪">
</p>
</form>
<form action="cgi-bin/abc.cgi" method="post">
<p>
名前:<input type="text" name="namae">
</p>
<p>
<input type="image" src="images/kaeru.png" alt="押してケロ♪">
</p>
</form>
↓↓↓
ブラウザ上の表示