HTMLタグの相対パスを指す書き方で、ドット1つの「./」または2つの「../」がありますが、それぞれどういう意味なのかを例と共に解説です。
HTML初心者や、しばらくコーディング作業から離れていると忘れてしまいがちですよね。
ではまずは1つのドット「./」ですが、そのファイルと同じ階層にあることを示しています。
上の階層でも下の階層でもなく同じです。
ただしこちらは省略することも可能なので「./」を取り除いても同じ意味になります。
2つのドット「../」は、1つ上の階層を示しています。
こちらは省略は不可で、上の階層のファイルを指す場合は必ず記載する必要があります。
「../../../」のように複数回使えばその回数分上の階層をさします。
上記の内容を踏まえて下の表に簡潔にまとめました。
| 相対パス | 意味 | 説明 |
|---|---|---|
| ./ (ドット1個) | そのファイルと同じ階層 | 同じ階層なので「/main.html」から「/sub.html」を指定する場合は./sub.htmlとなります。 1つ下のimgフォルダにある画像を指定する場合は./img/gazou.jpgです。 省略することも可能で、img/gazou.jpgと書いても同じ意味です。 ただしドットだけを省略してスラッシュから始めてしまうと意味が異なりますので注意。 |
| ../ (ドット2個) | そのファイルの1つ上の階層 | 「/game/fps/apex/index.html」このファイルから記述するとして、fpsフォルダのetc.htmlを指定する場合は、自分は今apexフォルダにいるので、../fps/etc.htmlとなります。 2つ上のgameフォルダのindex.htmlを指定する場合は../../index.htmlのように2回書けば指定できます。 index.htmlは省略できるので、../../でも同じ意味です。 |
