HTMLの基礎

　<img src="panda.gif">

これで、panda.gifというファイルの画像が表示されます。panda.gifのファイル名は、リンクタグと同じように絶対パス、相対パスのどちらかで指定します。このタグには終了タグがありません

　<img src="panda.gif" border="2">

<img>タグにborderオプションをつけると、その値の大きさの枠が描かれます。値が大きいほど線が太くなります。線が不要であればborder="0"にします。

　<img src="panda.gif" alt="パンダの絵">

接続速度の遅いモデムでは画像の表示に時間がかかるので、表示させないようにブラウザの設定を変更している人もいます。このように設定している人たちはどんな画像なのか分かりません。そのため、画像を説明する文字を<img>タグのalt(アルトまたはオルトと読む)オプションで指定します。このオプションは、なるべくつけるようにしましょう。

　<img src="panda.gif" width="200" height="300">

widthで画像の幅、heightで画像の高さをピクセルで指定します。サイズを指定すると画像の大きさがあらかじめわかるので、ブラウザが素早くページを表示できます。

　<body bgcolor="yellow">～</body>

第２章で勉強した<body>タグを覚えていますか? これにbgcolorオプションをつけると、背景の色を変えることができます。色の指定は文字の色を変更するときと同じで、色の名前または光の三原色(RGB)を16進数で指定します。

　<body background="panda.gif">～</body>

<body>タグにbackgroundオプションをつけると、背景に画像を貼ることができます。 <img>タグと同じで、panda.gifのファイル名を変えることによって、好きな画像を貼れます。画像のサイズがウィンドウサイズより小さい場合は、縦横に繰り返して画像が表示されます。

パンダ君の失敗談

お絵描きソフトで作成した画像ファイルをページに貼りつけようと、<img>タグにきちんと指定したけど、ブラウザに表示されなかった。なんとブラウザに表示できる標準の画像ファイルの種類は、GIF(ジフ)とJPEG(ジェーペグ)だけなんだって。