Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】image属性値の使い方

image属性値の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

image定数は、HTMLの<input>要素のtype属性に指定することで、画像形式の送信ボタンを生成するために使用される定数です。テキストボタンではなく、グラフィカルな画像をボタンとして表示したい場合に利用されます。

この定数を指定した<input>要素は、src属性を用いて表示する画像のファイルパスを定義する必要があります。また、画像の表示に失敗した場合や、アクセシビリティ向上のために、alt属性で代替テキストを提供することが推奨されます。

ユーザーがこの画像ボタンをクリックすると、フォームデータとともに、クリックされたX座標とY座標もサーバーに送信されます。これにより、画像上の特定の地点がクリックされたかどうかの処理が可能となり、画像マップのような機能を実現する際に役立ちます。

image定数は、フォーム送信をトリガーする機能を持つだけでなく、ウェブページの視覚的な表現力を高める上で重要な役割を果たす要素です。

公式リファレンス: <input type="image">

構文(syntax)

1<input type="image" src="submit-button.png" alt="送信">

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ