Open In App

How to link back out of a folder using the a-href tag?

Last Updated : 10 Sep, 2020
Improve
Improve
Like Article
Like
Save
Share
Report

Introduction:

Whenever we make a project it is generally distributed among various folders. That is generally done to improve the connectivity and readability for the various web developers working on the same project. For example:

The above classification is just an example but the classification can be bigger. So if you have to call an image from the image folder for the home page or want to call a page in article form the home page it would be a direct URL ie. “Images/gfg.jpg” or “Other Pages/Articles/Gfg Article1.html“. But if you have to call an image from the image folder for the Gfg Article1 page then the general URL will not work. You have to use a relative file path.

To learn more about the relative path please follow this article.

Example 1:

It shows the path of the file present in a folder above the folder of the current web page file. The image file present in a folder called images and current web page file exists inside a subfolder, then the code will be as follows:




<!DOCTYPE html> 
<html
    <head
        <title>Relative file path</title
    </head
    <body
        <h2>File present in a folder above the current folder</h2
        <img src="../images/gfg.jpg" alt="My Image" style="width:200px"
    </body
</html>


Output:

Example 2:

It shows the path of the file present in a folder which is located at the root of the current subdirectories.




<!DOCTYPE html> 
<html
    <head
        <title>Relative file path</title
    </head
    <body
        <h2>File present in a folder which is located at<br
        the root of the current subdirectories</h2
        <img src="/images/picture.jpg" alt="My Image" style="width:200px"
    </body
</html>


Output:



Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads