画像を表示させます。
A 要素と組み合わせて サーバーサイドイメージマップとして使用したり
MAP 要素と組み合わせて
クライアントサイドイメージマップとして使用することができます。
この要素を用いる場合は、画像を表示することができないブラウザや音声ブラウザのために alt 属性に代わりとなるテキストを記述しなければなりません。
たとえば、会社のロゴマークの画像の場合、 「会社のロゴ」とするよりも会社名を記述するほうがいいでしょう。 また画像がただの装飾の場合は、alt="" と空のテキストを記述するほうがいいでしょう。
画像の付加的な説明を記述するには title 属性、または longdesc 属性を用います。
| 要素の内容 |
|---|
| なし ( 空要素 ) |
| 一般属性 |
|---|
|
style |
title |
id |
class |
dir |
lang |
xml:lang |
xmlns |
onclick |
ondblclick |
onkeydown |
onkeypress |
onkeyup |
onmousedown |
onmousemove |
onmouseout |
onmouseover |
onmouseup
個々の説明は 一般属性 を参照してください。
|
| 固有属性 | |
|---|---|
| src |
表示する画像の URI を指定します。 ブラウザで表示できる画像フォーマットには、 jpeg gif png などがあります。 |
| name | この画像をスクリプト等から参照するための名前を NMTOKEN で指定します。 同じ文書中で重複してはいけません。 ( この属性は 1.1、Basic 以降からは使用できません。 代わりに id 属性を使用します。) |
| align |
周りの文字との上下の位置関係を top ( 上端を合わせる ) middle ( 中央を合わせる ) bottom ( 下端を合わせる ) のいずれかで指定します。 または、テキストの回りこみを left ( 文字の左側に配置 ) right ( 文字の右側に配置 ) で指定します。 ( 過去との互換性のためだけに存在する属性です。 代わりにスタイルシートの vertical-align または float を使用してください。) |
| alt | 画像を表示することができないブラウザや音声ブラウザのために 代わりとなる テキスト を記述します。 |
| border | 画像をリンクとして使用する場合に回りに表示される枠の幅を ピクセル単位( Pixels ) で指定します。 ( 過去との互換性のためだけに存在する属性です。 代わりにスタイルシートの border を使用してください。) |
| longdesc | 表示する画像の説明が title 属性だけでは不十分な場合、 説明を記述した文書の URI を指定します。 |
| usemap | この画像をクライアントサイドイメージマップとして使用する場合に 使用する MAP 要素の名前を #名前 のように指定します。 ( Basic では使用できません。) |
| ismap | ismap と指定することで、この画像がサーバーサイドイメージマップとなります。 サーバーサイドイメージマップを使用すると CGI にクリックした座標が送られます。 ( Basic では使用できません。) |
| hspace | 画像の左右のスペースを ピクセル単位( Pixels ) で指定します。 ( 過去との互換性のためだけに存在する属性です。 代わりにスタイルシートの margin を使用してください。) |
| vspace | 画像の上下のスペースを ピクセル単位( Pixels ) で指定します。 ( 過去との互換性のためだけに存在する属性です。 代わりにスタイルシートの margin を使用してください。) |
| width | 画像の幅を指定します。実際のサイズを指定しなくてもかまいません。 ピクセル単位または 親要素の幅に対する割合 ( Length ) で指定します。 |
| height | 画像の高さを指定します。実際のサイズを指定しなくてもかまいません。 ピクセル単位または 親要素の高さに対する割合 ( Length ) で指定します。 |
<img src="image.gif" width="100" height="80" alt="画像" />
サーバーサイドイメージマップとして使うには以下のようにします。
<a href="cgi-bin/ismap.cgi">
<img src="image.gif" width="100"
height="80" alt="画像"
ismap="ismap" />
</a>