絶対パスと相対パス
「パス（ファイルまでの道筋）の書き方の種類」として、
絶対パス
相対パス
があります。
「logo.png」というファイルへのパスを「絶対パス」「相対パス」それぞれで書いた例は以下のとおりです。
絶対パス ： http://webliker.info/wp-content/themes/template/img/common/logo.png
相対パス ： ../img/common/logo.png
絶対パスの書き方
絶対パスは、そのフォルダが保管してある一番上の階層からすべて書きます。
ドメイン名/フォルダ/ファイル名
例）<img src="http://webliker.info/wp-content/themes/template/img/common/logo.png">
※リンク先が外部のサイトである場合、絶対パスで書く必要があります。
相対パスの書き方
相対パスでは「表示したいページ」から見て、「読み込みたいファイルがどこ」にあるか？
を基準にしてパスを記述します。
同じサーバー内のファイルを読み込む場合は、相対パスで書きます。
例）読み込みたいファイルが同じ階層にある場合
- index.html ←表示したいファイル
- img
- ∟common
- ∟logo.png
- ∟Apple.png ←読み込みたい画像
同じ階層は「./」 ※「./」を書かなくてもフォルダ名だけで同じ階層であることを表すことができます。
index.htmlから見て、Apple.pngのパス
「img/common/Apple.png」
「./img/common/Apple.png」
例）読み込みたいファイルが上のフォルダ階層にある場合
- folder
- ∟folderA ―index.html ←表示したいファイル
- ∟img
- ∟common
- ∟logo.png
- ∟Apple.png
- ∟folderB ―img―melon.png ←読み込みたい画像
表示したいファイル（例えばindex.html）からみて、
読み込みたいファイルが上のフォルダ階層にある場合は「../」
「../img/melon.png」
例）読み込みたいファイルが２つ上のフォルダ階層にある場合
- フルーツ
- ∟folderA ―index.html ←表示したいファイル
- img
- ∟common
- ∟logo.png
- ∟Apple.png
- ∟folderB ―img―melon.png
- 本
- ∟folderA ―img―manga.png ←読み込みたい画像
２つ上の階層は「../../」
「../../folderA/img/manga.png」
今日はここまで。
