リンク先を指定するとき、配置画像を指定するときなどは、そのファイルの場所、画像の場所をHTML内に記述する必要があります。
指定方法には絶対パスと相対パスがあります。
【絶対パス】
リンク先や画像の保存先を、ブラウザに入力する通常のHPアドレスと同じように"http://"で始まる形で指定します。
例) <a href="http://www.yahoo.co.jp/" >ヤフー!</a>
【相対パス】
起点になるファイルから相対的に場所を指定します。同じサイト内のファイルや画像を指定する場合にこの方法が使われることが多いです。従って、この方法はサイトを作成するにあたって、必ず覚えなくてはなりません。この方法を理解するには、まず階層を理解しなくてはなりません。
階層とはきわめて簡単に言うとフォルダの関係のことです。皆さんもファイルをフォルダ内に保存する時、よくフォルダの中にまたフォルダを作成してより細かく小分けして管理したりしますね。このフォルダの関係を階層と表現します。
わかりづらいので図を使って説明します。
図中のピンク色のファイル"index.html"を起点とします。

"contents1"フォルダ内の「image1.gif」は同じ階層になり、"HomePage"フォルダ内の
「index.html」は上の階層になります。"contents1"フォルダ内の"images1"フォルダ内にある
「images.gif」
は下の階層になります。
それでは "index.html"を起点(HTMLを書いているページ)にし、相対パスでの指定方法を記します。
・同階層にある"image1.gif"を貼る。
<img src="image1.gif">
・下の階層にある"image2.gif"を貼る。
<img src="images/image2.gif">
フォルダ名/ファイル名 の形で書きます。
・上の階層にある"index.html"にリンクさせる。
<a href="../index.html">
"../"は一つ上の階層を指定する方法です。二つ上は"../../"になります。
・「HomePage」
フォルダ内にある「images」フォルダ内の"image3.gif"を貼る。
<img src="../images/image3.gif"> |
| << タグについて 2 |
ファイルの階層意識 >> |
 |
|
|
 |
|
| |
■WEBデザインの基本 |
 |
|
|