パス
ファイルを置いている場所。
パスの指定方法には、絶対パスと相対パスがある。
絶対パス
http:// から始まるサイトのアドレス(URL)を使い、ファイルの場所を指定する方法。
外部サイトにリンクする場合には、絶対パスで指定する。
例)
<a href=”http://○○.com”>○○.comへ。</a>
上の図の img を絶対パスで表わすと、
<img src=”htttp://○○.com/img/○○.jpg” alt=”” >
通常、この場合、相対パスで表わす。
<img src=”img/○○.jpg” alt=”” >
相対パス
現在地を基準にした相対的な指定ファイルの場所の指定方法。
ページ内リンクをする場合などで用いる。
外部サイトを相対パスで記述することはできない。
相対パスのメリット
相対パスなら、開発時のローカル環境でも、表示や動作の確認を行うことができる。
サーバーを引っ越しても、パスを修正する必要はない。
ポイント
自分が今、記述しているファイルの現在地を把握すること。
相対パスの記述法
同じフォルダ内
パスにはファイル名を記述する。
<a href=”○○.html”>ページ○○へ</a>
<img src=”○○.jpg” alt=””>
下層のフォルダにファイルが存在する場合
フォルダ名/ファイル名と記述する。
<a href=”folderB/○○.html”>○○ページへ</a>
<img src=”folderB/folderC/○○.jpg” alt=””>
上の階層のフォルダにファイルが存在する場合
フォルダを上がる分、[../]に続けてファイル名を記述する。
[../] 1つ上の階層を指定。
[../../] 2つ上の階層を指定。
<a href=”../../○○.html”>○○ページへ</a>
<img src=”../○○.jpg” alt=”” >
異なるフォルダにファイルが存在する場合
一度、上のフォルダに上がってから、ファイルの存在する下がる。
<img src=”../folderC/○○.jpg” alt=”” >
【参照】
[amazonjs asin=”4797383038″ locale=”JP” tmpl=”Small” title=”たった2日で楽しく身につく HTML/CSS入門教室 (Design&IDEA)”]