HTMLクイックリファレンス

トップページ HTMLタグ(ABC順) スタイルシート(ABC順) フリーイラスト素材
優良デザイン HTMLタグ(目的別) スタイルシート(目的別) JavaScript(制作中)
WEBカラー WEB画像 特殊文字 その他..

トップページ > HTMLタグリファレンス > <IMG>

★HTMLタグリファレンス

<IMG>・・・・・画像を表示する
Internet Explorer4Internet Explorer5Internet Explorer5-macInternet Explorer5.5Internet Explorer6Internet Explorer7 Netscape4Netscape6Netscape7 Opera6Opera7Opera8Opera9 Firefox1Firefox2

<IMG>はImageの略で、画像を表示するタグです。 表示する画像ファイルはsrc属性(srcはsourceの略)で指定します。 WEBに使用できる画像形式は、現在のところGIF・JPEG・PNGの三種類ですが、それぞれ特徴があるので、状況により使い分けてください。 画像ファイルについての詳細は、「WEB画像について」を参照してください。

width属性とheight属性は、画像ファイルのブラウザ上での表示サイズを指定します。 画像の表示サイズはできるだけ指定するようにしましょう。 画像サイズを指定することで、画像の読み込みに時間が掛かる場合にも、 指定したサイズ分の画像表示スペースが空けられて先にテキスト部分を表示するので、閲覧者にとっては表示速度が早く感じられるからです。

HTML4.0からは<IMG>のalt属性が必須となっています。 alt属性では画像を表示できない場合に代わりに表示するテキストを指定します。 ここで指定するテキストは、読み上げソフトで音声になったり、点字で表現される場合があるので、適切なものを指定しなくてはなりません。

alt属性では画像に関する説明をするのではなく、そのページ全体をテキストだけで表現する際に置き換わるべきものを指定します。 例えばそのページがラジオで放送されたり、そのページの内容を電話で伝えることを想定してみると良いのだそうです。 画像の上にマウスを乗せた際に、画像に関する説明等のテキストを表示させることが目的の場合には、title属性を使用してください。

■使用例

HTMLソース

<img border="0" src="../images/img001.gif" width="128" height="128" alt="イラスト1">
<img border="1" src="../images/img002.gif" width="128" height="128" alt="イラスト2" title="犬とサッカー">
↓↓↓

ブラウザ上の表示

イラスト1 イラスト2



▲ページ先頭へ
トップページ > HTMLタグリファレンス > <IMG>

HTMLクイックリファレンス

トップページ HTMLタグ(ABC順) スタイルシート(ABC順) フリーイラスト素材
優良デザイン HTMLタグ(目的別) スタイルシート(目的別) JavaScript(制作中)
WEBカラー WEB画像 特殊文字 その他..
HTMLクイックリファレンスについて
©2009 HTMQ