画像を貼る!

 色々なテキストの表現方法を紹介しましたが、やはりそれだけでは見栄えのするページ作りは難しいでしょう。特に背景に模様を入れたい場合などは画像を使うしかありません。また、他のページへリンクする場合にバナーを貼る事も多いでしょう。というわけで画像の使い方の解説です。

背景に画像を貼る


<BODY background="bg.png">


 ページ全体の背景に画像をタイル上に敷き詰めます。ここでは上の枠線(TABLEタグ)内に指定してありますが、最初に解説したBODYタグにbackground属性で画像ファイルを指定すると、ページ全体が上の枠内の様になります。

画像を貼る

<IMG src="sample.png" width="200" height="40" alt="サンプル">
          ↓
サンプル

 普通にページ上に画像を貼る場合はIMGタグを使用します。そのタグ自体が一つの要素となるので終了タグはありません。
 width,height属性で画像の横幅と高さをpixel単位で指定します。実際のサイズと違う数値を入れるとブラウザの機能で拡大・縮小を行いますが、あまりやらない方がいいようです。しかし、サイズを指定しないと画像からサイズ情報が読み込まれるまで表示領域を確保する事ができず、表示に時間がかかる原因となるので、正しい値で指定しておきましょう。
 alt属性は元々代替テキストといって、画像を表示出来ないブラウザで画像の代わりに表示する為のものでしたが、最近ではそういったブラウザを使う人はほとんどおらず、マウスポインタを画像に合わせると表示されるのでその画像のコメント文として使われている場合が多いです。
 それからIMGタグにはもう一つborder属性があります。次で解説するAタグでIMGタグを囲み、画像をクリックするとジャンプするようにすると、リンクされていることが分かるように画像の周りに枠線が付くのですが、この属性はその枠線の太さをpixel単位で指定します。

≪Index  ≪Back  Next≫