画像表示を行うための要素です。 文字以外を扱う唯一の要素で、ホームページを美しく飾ることができます。 ただし、i-modeではGIF形式のみのサポートを行っており、それ以外（例えばJPEGやPNGなど）はサポート外です。 また、あまりに大きな画像は表示時間を要しますので避けるようにしたいものです。
画像サポートがGIF形式だけだということを忘れないようにしましょう。 また、カラー非対応のi-modeでは当然カラー表示できないので、２色のGIF画像のみのサポートとなります。
ALT属性は画像表示できないときに代替文字を表示するものです。 i-mode全般、画像表示は可能ですが、アクセス時間短縮のために画像表示しない設定にしている人もいるかもしれません。 そんな方のために代替文字の指定は必ず指定するように心掛けましょう。 正式なHTMLにおいては、省略してはいけない属性になっています。 しかし、残念なことにあまり長すぎても表示できないようです。 半角12文字程度を目安に簡潔に指定しておきましょう。
枠線表示に対応していない機種や表示スペースの取り方などが機種によって若干異なるものがあるようです。 あまり、小技にとらわれると機種ごとに表示が変わってくる、なんていう現象が起こりますので注意が必要です。 枠線表示に関しては正式サポートしていないようです。
WIDTH属性を指定してHEIGHT属性を指定しない場合、又はその逆の場合は、元の画像の縦横比（アスペクト比）に合わせて指定していない属性値も変更されます。 これを利用して、「WIDTH="100%"」のみ指定すると、画像の形を壊さずに適当な高さに表示されます。（元の画像サイズが幅50、高さ20としたとき、幅を100にすると自動的に高さが40に表示される） また、サイズ指定をしておくことで、画像読込前にレイアウト固定ができます。
IMG要素はインライン要素で、改行させることを明示しなければ画像に続いて文字も表示されます。 これを利用して、画像の周りに文字をも割り込ませることも可能です。 また、回り込み解除にはBR要素で行います。
- SRC （必須）
- 画像ファイルのURLを指定します。相対パス、絶対パスどちらでも構いません。 指定を省略すると、画像表示できません。
- ALT （必須）
- 画像表示できないときに代替で表示します。 アクセシビリティの向上のために必ず指定するようにしましょう。 しかし、残念なことにあまり長すぎても表示できないようです。 半角12文字程度を目安に簡潔に指定しておきましょう。
- BORDER （HTML4.0では非推奨）
- 画像の縁に枠線を表示します。省略すると、枠線表示はありません。 ピクセル数で枠線太さを指定するもので、省略した場合は「0」扱いになります。 一部の機種では枠線表示できないものもあります。（正式にはサポートしていないようです）
- ALIGN （HTML4.0では非推奨）
-
- 「top」 ：画像の上部に文字を揃える
- 「middle」：画像の中央に文字を揃える
- 「bottom」：画像の下部に文字を揃える（規定値）
- 「left」 ：画像を左側に、文字を右側に回り込ませる
- 「right」 ：画像を右側に、文字を左側に回り込ませる
top middle bottom left right 
- WIDTH （HTML4.0では非推奨）
- 元の画像サイズに関係なく、表示する画像の幅をピクセル、又は画像の幅に対する割合（パーセント）で指定します。 元の画像サイズよりも大きな場合は画像が粗くなり、小さな場合は画像が潰れて見えます。 ＰＣのディスプレイと同じように考えないようにした方が良いようです。 HEIGHT属性を指定していない場合は、WIDTH属性で指定した大きさに合わせて、元の画像サイズの縦横比（アスペクト比）から自動的に高さも変化します。
- HEIGHT （HTML4.0では非推奨）
- 元の画像サイズに関係なく、表示する画像の高さをピクセル、又は画像の高さに対する割合（パーセント）で指定します。 元の画像サイズよりも大きな場合は画像が粗くなり、小さな場合は画像が潰れて見えます。 ＰＣのディスプレイと同じように考えないようにした方が良いようです。 WIDTH属性を指定していない場合は、HEIGHT属性で指定した大きさに合わせて、元の画像サイズの縦横比（アスペクト比）から自動的に幅も変化します。
- HSPACE （HTML4.0では非推奨）
- 画像周りの横方向のマージンをピクセル数で指定します。 指定した値が画面幅の半分を超える場合は０として扱われるようです。
- VSPACE （HTML4.0では非推奨）
- 画像周りの高さ方向のマージンをピクセル数で指定します。
<html> <head> <title>TEST PAGE</title> </head> <body> <div> <img src="img1.gif" alt="SAMPLE" align="right"> 文字の回り込みを使った方法を使って、 <img src="img2.gif" alt="SAMPLE" align="left"> こんなこともできます。 </div> </body> </html>
