フルスタックエンジニアのノウハウ
2021.06.02    2021.12.06

相対パスって何??

相対パスって何??

この記事の動画版はこちら

チャンネル登録お願いします!


今回は、講座のフォーラムに頂いたご質問を紹介します。


ご質問内容


先日、講座の受講生さんからこのようなご質問をいただきました。


リンク先や画像の指定などで「./」という指定を見かけることがあるのですが、これはどういった意味なのでしょうか?

調べてみると「相対パス」という指定方法のようですが、いまいち意味が分からなかったため、教えてください。


回答内容


これに対して、僕がお答えした内容はこんな感じです。


パス(つまり、ファイルのある場所)の指定方法には、「相対パス」と「絶対パス」という2つの指定方法があります。


相対パスは、自ファイルが置かれている場所からの相対的な位置指定
絶対パスは、最上位階層からの絶対的な位置指定


となります。



例えば、デスクトップに「index.html」というファイルと、「img」というフォルダがあり

imgフォルダの中に「sample.png」というファイルが入っていたとします。



このとき、index.htmlから見た「sample.png」の位置は、

絶対パスだと「/デスクトップ/img/sample.png」

相対パスだと「img/sample.png」

となります。




また、相対パスでは「./」は「自ファイルと同じ場所」という意味になり、「../」とドットを2つ書くと「自ファイルの1つ上の階層」という意味になります。


つまり、ご質問にあったこの指定方法<img src="./sample.png">は、自ファイル(index.html)と同じ階層にある、imgフォルダの中のsample.pngを指定している訳ですね。



ちなみに、<img src="sample.png">のように、先頭の「./」を省略しても同じ意味になります。



ということでした。


同じような疑問をお持ちの方は、ぜひ参考にしてみてくださいね。


おすすめ記事