What is file path in HTML ?
HTML file path defines the location of a file in a website folder.
HTML file path is the address of the file for the web browser.
Why file paths are used ?
File path is used to link files in the webpage, when webpage is loaded the browser renders the file from the path location and displays it in the webpage.
For example in image tag src attribute is used to specify the file path.
1. <img src=”pic.jpg”>
Image pic.jpg is located in the same folder as the current page.
2. <img src=”images/pic.jpg”>
Image pic.jpg is located in the images folder in the current folder.
3. <img src=”/images/pic.jpg”>
Image pic.jpg is located in the images folder at the root of the current web.
4. <img src=”../pic.jpg”>
Image picture.jpg is located in the folder one level up from the current folder.
File paths are mostly used in webpages to link external files, listed below
1. Web pages
2. Images
3. Style sheets
4. JavaScript
HTML coding for a website !!!
Click to Learn More about – HTML Tutorial for beginners
Types of file path
Basically there are two types of file paths they are
1. Relative file path
2. Absolute file path
1. Relative file path
This specifies to a file which is related to the location of current page.
Example :
<!DOCTYPE html>
<html>
<head>
<title>File path</title>
</head>
<body>
<p>Relative file path</p>
<img src="pic.png">
<img src="images/pic.png">
</body>
</html>
Output :
2. Absolute file path
This specifies full URL address of the file.
Example :
<!DOCTYPE html>
<html>
<head>
<title>File path</title>
</head>
<body>
<p>Relative file path</p>
<img src="https://secureservercdn.net/192.169.221.188/s30.e0b.myftpupload.com/wp-content/uploads/2020/06/HTML-PixTeller-1-2.png">
<img src="https://secureservercdn.net/192.169.221.188/s30.e0b.myftpupload.com/wp-content/uploads/2020/06/core-java-copyright-img-1.png">
</body>
</html>
Output :
