ぱそおーるHTML講座

src : 画像URL（ファイル名）を設定します。IMGタグには必ず使います。省略は出来ません。
<img src="画像URL（ファイル名)">という感じで、セットとして覚えておきましょう。
<img src="sample.gif">
←この画像のファイル名がsample.gifです。

width : 画像の幅を設定します。ピクセル単位、または％で設定します。
height : 画像の高さを設定します。ピクセル単位、または％で設定します。
省略すると本来の画像サイズで表示されますが、画像読み込みが終わらない間はページ自体の読み込みが行われません。表示速度を早くする意味があるので、画像サイズを変更しない場合も記述しておく事をおすすめします。
<img src="sample.gif" width="90" height="72">
←画像サイズを指定しても、表示に変わりはありません。

border : 画像枠線を設定します。ピクセル単位で設定します。
<img src="sample.gif" border="10">
←画像に枠線が表示されます。

alt : 画像にテキストを埋め込みます。画像が表示されなかった場合は、テキストが表示されます。
マウスカーソルを画像の上に置いた時にもテキストが表示されます。
<img src="sample.gif" alt="うさぎさん">
←マウスカーソルを上に置いてみてください。

hspace : 画像の左右に余白を設定します。ピクセル単位で設定します。
vspace : 画像の上下に余白を設定します。ピクセル単位で設定します。
<img src="sample.gif" hspace="20" vspace="20">
←上下左右に余白が設定されています。

align : 画像とテキストの位置を設定します。

1. bottom : 画像の下部にテキストを表示します。（デフォルト）
2. middle : 画像の中央部にテキストを表示します。
3. top : 画像の上部にテキストを表示します。

<img scr="sample.gif" align="値">
←bottom表示しています。
←middle表示しています。
←top表示しています。
上の設定だと、画像の横に表示させるテキストに改行を使う事ができません。
複数行のテキストを使う場合は下の値を使います。
回り込みと呼ばれています。

1. left : 画像を左に配置します。テキストは画像の右側に表示されます。
2. right : 画像を右側に配置します。テキストは画像の左側に表示されます。

画像を左に配置しています。
複数行にわたってテキストを表示する事が出来ます。

画像を右側に配置しています。
複数行にわたってテキストを表示する事が出来ます。

回り込みを解除するには、<br clear="left">とする事で、画像の左配置を解除出来ます。
rightなら右の画像配置を解除。allなら画像位置にかかわらずに解除出来ます。
大きな画像に対して回り込みを使った場合には必要になってきます。