ここで学習するエレメント
IMGエレメント
画像ファイルとひとことで言っても、その種類はたくさんあります。
HTML文書で利用できる画像フォーマットは、GIF形式(拡張子が.gif)とJPEG形式(拡張子が.JPG、もしくは.JPEG)です。Windowsの壁紙などで利用されているBMP形式は、利用できませんので注意してください。
これらの画像フォーマットは、Windows付属のペイントツールでは作成できません。フリーソフトウェアやシェアウェア、市販商品などを入手して作成や画像フォーマット変換を行います。
とりあえず、窓の杜のペイント系ツールのダウンロードページを覗いてみましょう。
では、画像を貼ってみましょう。画像を貼るには IMGエレメントを使います。
ブラウザで参照すると、以下のように表示されます。
この通り、画像が表示されました。IMGエレメント内の各属性は、以下の通りです。
| SRC= | 画像ファイル名を記述します。 画像ファイルがHTML文書と違うディレクトリにある場合は、パスも指定します。 |
| WIDTH= | 画像ファイルの横サイズを記述します。 |
| HEIGHT= | 画像ファイルの縦サイズを記述します。 |
| ALT= | 画像表示に対応していないブラウザで見たとき、画像の代わりに表示する文字を記述します。 |
画像のファイルサイズは、画像ファイルのみをブラウザに表示させれば、その画像のサイズがタイトルバー上に表示されます。
また、画像を大きく表示させたい、小さく表示させたいといった場合は、WIDTH、HEIGHTの値を変化させてください。
例えば、上のタイトルバーの画像は、WIDHT="149" HEIGHT="46" で表示しています。
WIDHT="50" HEIGHT="100"で表示すると以下のようになります。
縦長になってしまったので、なにがなんだか分からなくなってしまいましたが、こういうことです。