簡単内職アルバイトTOPへ
←back   index   next→
画像を表示しよう

ネットサーフィンをしていると、まれに文字だけで構成されているホームページをみかけます。別にそれが悪いというわけではありませんが、どうしても見にくくなったり、面白みが薄れてしまっているような気がします。 (私のサイトもあまり画像がありませんが・・)
そこでちょっと華やかにしたり、アクセントをつけるのに役立つのが「画像の表示」です。タグ的には結構簡単なのですが、少しだけリンクに関わる所があるのでここまで引っ張ってきました。使用するタグは

<img src="〇〇">

というタグを使います。〇の中には画像のある場所・ファイル名前を指定します。
では実際にやってみましょう。まず、画像のファイルがたくさん増えてくると管理が非常に面倒になるので、画像を入れるだけの画像専用フォルダを作ります。皆さんの「homepage」フォルダ内に「image」というフォルダを新たに作って下さい。そして下の画像を右クリックし、「名前を付けて画像を保存」を選択します。ファイル名は「photo-01.jpg」として保存します。
以上で準備は完了です。それでは早速画像を表示させてみましょう。ソースは下のようになります。

<img src="image/photo-01.jpg">

このソースはいままでとちょっと違うところがありますね。ファイル名の「photo-01.jpg」の前に「image/」というのが付いています。これは「imageフォルダ内」を意味しています。ですからこのソースは
imageフォルダのphoto-01.htmlというファイルを開け
という命令になっているのです。

このように、同じフォルダ内の別のフォルダにあるファイルを指定する場合、
別フォルダ名/ファイル名 と指定します。このようなファイルの指定の仕方はリンクでファイルを指定するときでも全く同じですので、必ず覚えておいて下さい。

□ 同じフォルダ内にあるファイル
  ファイル名のみ

□ 同じフォルダ内の別フォルダにあるファイル
  別フォルダ名/ファイル名

□ 一階層上のフォルダにあるファイル
  ../ファイル名 (ファイルの名前の前にピリオドを2つとスラッシュを付ける)

□ 一階層上の別フォルダにあるファイル
  ../フォルダ名/ファイル名

□ 二階層上のフォルダにあるファイル
  ../../ファイル名

次へ進む