For anyone who has found this thread, addressing relative paths has always created arguments over what is correct or not.
Depending on where you use the path to be addressed, it will depend on how you address the path.
Generally :
. and ./ do the same thing, however you wouldn't use . with a file name. Otherwise you will have the browser requesting .filename.ext as a file from the server. The proper method would be ./filename.ext.
../
addresses the path up one level from the current folder. If you were in the path /cheese/crackers/yummy.html, and your link code asked for ../butter/spread.html in the document yummy.html, then you would be addressing the path /cheese/butter/spread.html, as far as the server was concerned.
/ will always address the root of the site.
A file path describes the location of a file in a web site's folder structure.
File Path Examples
| The "picture.jpg" file is located in the same folder as the current page | |
| The "picture.jpg" file is located in the images folder in the current folder | |
| The "picture.jpg" file is located in the images folder at the root of the current web | |
| The "picture.jpg" file is located in the folder one level up from the current folder |
HTML File Paths
A file path describes the location of a file in a web site's folder structure.
File paths are used when linking to external files, like:
- Web pages
- Images
- Style sheets
- JavaScripts
Absolute File Paths
An absolute file path is the full URL to a file:
Example
Try it Yourself »
The It specifies that picture.jpg is located in the same folder as the current page.
File paths are used on webpages to link external files like:
- Web pages
- Images
- Style sheets
- JavaScript
There are two types of File Paths:
- Absolute File Paths
- Relative File Paths
Absolute File Paths
Absolute file path specifies full URL address.
Example:
Test it NowRelative File Paths
The relative file path specifies to a file which is related to the location of current page.
Example:
Let's take an example to see how the file path points to a file in the images folder located at the root of the current web.
Test it NowExample:
This is how a file path points to a file in the images folder located in the current folder.
Test it NowExample:
When the images folder located in the folder one level above the current folder.
Test it NowImportant Points for File path:
- Always remember to use proper URL, file name, image name, else it will not display on the webpage.
- Try to use relative file paths, so that your code will be independent of URL.