## 画像

トップ > 逆引きリファレンス > 画像

#### ■ 画像を貼り付けるには

<img src="..."> を用います。src には画像ファイルのアドレス（URL）を指定します。alt は必ず、width と height は極力指定するようにしましょう。

    <img src="mame.gif" alt="マメ" width=25 height=25>
| → |

#### ■ 画像のサイズを知るには

画像の大きさ（縦横の長さ）を知るには、Internet Explorer や Netscape などのブラウザで height や width を指定しない状態の画像を表示し、画像をマウスの右クリック（Macintosh の場合はマウスをしばらくクリック）から [プロパティ] を表示することで知ることができます。

#### ■ 画像が表示されない!?

画像を張りつけたのにうまく表示できない。そんな時は次のような原因が考えられます。

- ファイル名が誤っている。（意外に多いので念の為再チェック）
- フォルダ名が誤っている。フォルダの指定方法に習熟していない場合は、HTMLファイルと画像ファイルを同じフォルダに置き、src="xxx.gif" のように src 属性に画像のファイル名のみを指定するようにしてみましょう。
- GIF ファイルを作成するのに、ファイル名だけを xxx.bmp から xxx.gif に変更している。（対応ソフトで変換する必要があります。）
- 画像ファイルをアップロードするのを忘れている。
- 画像ファイルへのリンクが file: で始まる名前になっている。src="ファイル名" や、src="フォルダ名/ファイル名" など、file: で始まらない名前にしましょう。
- ファイル名の大文字と小文字を誤っている。（サーバーが UNIX 系の場合は、ファイル名の大文字と小文字は別の文字として扱われます。）

#### ■ 画像を隙間無く並べるには

画像を並べる際に、画像と画像の間の隙間を無くすには、<img> タグの > と < の間にスペースや空白を空けないようにします。どうしても改行するなら、img と src の間など > と < の間以外の箇所で改行しましょう。

    <img src="image1.gif"><img
    src="image2.gif"><img
    src="image3.gif"><img
    src="image4.gif">

#### ■ 画像の上に文字を乗せるには

画像の上に文字を乗せるには、お絵描きソフトで編集する方法もありますが、もっと簡単にテーブルの背景として文字を乗せる方法があります。

    <table background="back.gif">
    <tr><th style="color:white">あいうえお</th></tr>
    </table>

| あいうえお

#### ■ イメージツールバーを無効にするには

Internet Explorer 6.0 以降、200×200 以上の画像にマウスを乗せると保存・印刷・メール送信・My Pictures呼び出し機能を持ったイメージツールバーが表示され、鬱陶しいことがあります。これを表示しないようにするには、Internet Explorer の [ツール]→[インターネットオプション]→[詳細設定]→[イメージツールバーを有効にする] をオフにして再起動する他、次の方法があります。

<img> タグに galleryimg 属性を指定する。

    <img src="xxx.jpg" galleryimg="no">

<meta> タグを使用する。

    <meta http-equiv="imagetoolbar" content="no">

#### ■ 画像に代替テキストを設定するには

テキストブラウザや、音声読み上げブラウザなど、画像を表示できないブラウザのために、<img> タグには alt 属性を指定しましょう。HTML4.01 では <img> の alt は必須属性として定義されています。alt 属性には画像の説明ではなく、テキストブラウザで表示された時に画像の『代わりとなる』文字を指定します。

    ○○ページへ <a href="next.html"><img src="go.gif"
    alt="Go!!" width=20 height=20 border=0></a>

デザインのためだけの画像には、alt="" と指定しておけばよいようです。これを怠るとテキストブラウザで [画像] と表示されてしまったりします。

    <img src="xxx.gif" alt="" width=20 height=20>

Copyright (C) 2003 杜甫々
初版： 2003年10月12日、最終更新：2003年11月23日
http://www.tohoho-web.com/how2/image.htm