まず、画像を表示する

<img src="ファイル名">

何やら複雑ですね。
順に ひも解いていきましょう。

まず、このタグには終了タグ

(</○○>)

がありません。

なぜか。

<br>

と同様に、囲うものがないからです。
基本的に囲うものは、文字です。画像に文字はありません。だから、終了タグもありません。

ということは、

<img>

というタグになるはずですね。

・・・でもこれだけでは、どこからどんな画像を引っ張ってくるのかわかりません。
そこで、登場するのが「src=”ファイル名”」です。

再び豆知識。このsrcというのは、sourceの略です。
ニュースソース(ニュースの出どころ)などのソースです。
※imgは、もちろんimage(画像)の略ですね。

ということは、「出どころ =(は) このファイルです」ということを記号化しただけです。

ファイル名が、first-web.jpgだったら、

<img src="first-web.jpg">

といった具合です。
imgとsrcの間に半角スペースがあることにも注意してください。

色々なタグの形が出てきたので、ちょっと整理してみましょう。
あ、あと、これ以上はもう、新しい形は出てきませんのでご安心を(笑)

通常(囲うものがあるとき):

<○○>文字など</○○>

囲うものがないとき:

<○○>

囲うものがなくて、タグに情報を加えたいとき:

<○○ ××="□□">

囲うものがあって、タグに情報を加えたいとき:

<○○ ××="□□">文字など</○○>

最後はまだ出てきていませんが、もうわかるでしょう?
HTMLは、ただただこれの繰り返しなんです。難しいことはありません。

では、画像を表示させてみましょう。


関連記事

  1. 自己表現ツールとしてのウェブサイト

  2. CSSの基本構造

  3. 横方向にセルを連結する

  4. 写真をあれこれ装飾する

  5. FTPソフトを用いて公開する

  6. “id”属性と”class”属性

お手本ナビの無料HPデザイン

ランダムピックアップ