ＧＴ－ＯＮＥ　楽天タグ講座　パイプ奮闘記

SRC="～画像ファイルのＵＲＬ～"　には画像の拡張子まで含めた、画像のファイル名までを指定します。

WIDTH="画像の巾"　には画像の横幅を指定できます。
HEIGHT="画像の高さ"　には画像の高さを指定できます。
（このWIDTH　とHEIGHT　を指定しなければ、元画像がもっている大きさが自動的に表示されます。）

ALT="画像の説明文"　には画像の説明文を入れられます。
（画像が表示されない環境や、画像を読み込み中にはこの説明文が表示されます。）

では、実際に画像のＵＲＬを入れて見ましょう。

この画像のＷＥＢ上（インターネット上）のＵＲＬ（アドレス）は

http://plaza.rakuten.co.jp/img/user/65/14/1286514/1.jpg　

なのですが、 これを確認するには、画像の上で、右クリックして、プロパティ(P) からアドレス(URL)で、
画像のＵＲＬを確認することができます。これを、先ほどのタグで、

<IMG SRC="http://plaza.rakuten.co.jp/img/user/65/14/1286514/1.jpg" >

と貼り付けますと、上のような画像が現れます。
WIDTH　と　HEIGHT　を指定しなければ、元画像がもっている大きさが自動的に表示されます。
ちなみにこの画像の　WIDTH="画像の巾"とHEIGHT="画像の高さ"は、
WIDTH="370"　HEIGHT="222"　となっておます。
この、画像の大きさも画像の上で右クリックでプロパティから見る事が出来ます。

では、この　WIDTH="画像の巾"とHEIGHT="画像の高さ"の数値を指定して、
画像を小さくして見ましょう。
小さくする場合も、大きくする場合も、幅と高さの比率は変えない事です。
そうしないと、伸びたり縮んだりした、画像になってしまいます。

では、WIDTH="370"をWIDTH="200"に小さくして見ましょう。
これは、０．５４倍にした事になります。ですから高さも同じ０．５４倍にすると、
HEIGHT="222"は、HEIGHT="120"という事になりますね。・・あってるよね・・・？（*^_^*）
幅と高さを指定してあげますと、画像はちゃんと小さくなってくれます。↓このように

<IMG SRC="http://plaza.rakuten.co.jp/img/user/65/14/1286514/1.jpg" WIDTH="200" HEIGHT="120">

では、ALT="画像の説明文"　に，画像の説明文を入れて見ましょう。
ALT="この車は私のＨＮである、ＧＴ－ＯＮＥです"と入れてみましょうか。↓そうするとこうなります。

<IMG SRC="http://plaza.rakuten.co.jp/img/user/65/14/1286514/1.jpg" WIDTH="200" HEIGHT="120" ALT="この車は私のＨＮである、ＧＴ－ＯＮＥです">

この、ALT="画像の説明文"はバナーとか、ボタンの説明に有効ですね。例えば下のバナーボタンは
ホームに戻るためのバナーボタンですが、ALT="ホーム"　と書くより、
ALT="トップページに戻ります"　と書いた方が、訪問者には、よくわかりますね。
左と右のバナーにマウスをあてて見てください。違いが分かりますね。

このように、マウスで画像をポイントすると、画像の説明文が表示されます。

次に↓下のようなボタンバナーに余白を持たせて見ましょう。
これじゃあ少しくっつきすぎですね。

これに、HSPACE="横余白"　VSPACE="縦余白"の属性のタグを追加しますと、
画像の上下左右に余白が出来ます。このように書いて見ます。