HTML基本タグ一覧表に戻る

HTML文書におけるタグの使い方
<IMG>タグの使い方の基本についての説明
☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆

右はHTML文書の基本構造です。この「タグの使い方」ページでは、右のHTML文書の中で、<BODY>と</BODY>とで囲まれた(1)Contents!の部分で使用する基本的なタグについて、その使用例を挙げます。以下を参照して下さい。

☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆
<HTML>
<HEAD>
<TITLE> TAGの使い方 </TITLE>
</HEAD>
<BODY>

    (1)Contents!

</BODY>
</HTML>

 

<IMG>タグを用いると、写真や絵などの画像を始め様々なコンテンツをブラウザ上に表示することができます。

<IMG SRC="画像URL">

と記述すると、画像を表示することができます。例えば、画像データとしてfrog.gifというカエルの画像データを持っていたとしたら、<IMG SRC="frog.gif">と記載すれば良いのです。ただし、まずは画像データを作るか入手するかしなければなりません。また、作成しているHTML文書と同じフォルダ(ディレクトリ)に画像データを格納しておかない場合は、記述方法が変わります。そのときは、画像データを格納している場所(PATH:パスと呼びます)を指定することになります。こちらは少しややこしく、相対パスか絶対パスか、好きな方式を選び、<IMG SRC="PATH/frog.gif">といったように記載します。初心者の方は面倒だと思いますので、なるべく前者側にすることをお勧めします。つまり、HTML文書と画像データは同じフォルダ(ディレクトリ)に格納するようにした方が良いでしょう。
このタグにはオプションを幾つか付けることができます。

WIDTH=nは画像の幅を指定(nはpixel数か%)
HEIGHT=nは画像の高さを指定
ALINE=top/middle/center/bottom/right/leftは表示位置
BORDER=nは枠線の太さ

これらは一例ですが、いろいろと試してみて下さい。なお、<BR>は改行、<CENTER>はセンタリング(中央寄せ)です。
  <HTML>
<HEAD>
<TITLE> TAGの使い方 </TITLE>
</HEAD>
<BODY BGCOLOR=LIGHTYELLOW>

<CENTER>
カエルです。<BR>
<IMG SRC="frog.gif">
</CENTER>

</BODY>
</HTML>











カエルです。

 

左側が作成したHTML文書。右側が、左側のHTML文書を実際にブラウザに表示した結果を示しています。

HTML基本タグ一覧表に戻る