HTML File Path – Tutorials Art

HTML file path defines the file location in folder structure of webpage.

Path	Description
<img src=”filename.exe”>	File is located in same folder
<img src=”image/filename.exe”>	File is in a subfolder name image placed in current folder
<img src=”/image/filename.exe”>	File is located in image folder at root of current web page.
<img src=”../filename.exe”>	File is located in a folder on level up from current folder.

File Path

When to Use HTML File Path?

File path is used to link the external files with the current html document such that.

Webpages
Images
Style Sheets

Absolute File path

Absolute File path is full address of webpage basically its the URL of webpage or file.

<!DOCTYPE html>
<html>
<body>

<h2>Absolute File Path</h2>
<img src="https://www.tutorialsart.com/tryit/media/nature.jpg" alt="Flower" style="width:400px">

</body>
</html>

Absolute File Path

Relative File Path

Relative file path is shorter than absolute path because it only contains file location relative to current page.

Example of File located in a folder on level up from current folder.:

<!DOCTYPE html>
<html>
<body>

<h2>Relative File Path</h2>
<img src="media/flower.jpeg" alt="Flower" style="width:400px">

</body>
</html>

Note: It is better to use relative path so that your code will be URL-independent.