---- HTML File Paths ----


 An HTML file path is used to specify the locationof a file in a website's project folder. These file paths act as an address of the file for web browser when it renders the webpage on the screen. The src or href attribute requires a value that links any external file to HTML file.

We can link various resources in our HTML file with the help of HTML file paths, such as:
  • Images
  • CSS files
  • JS files
  • Videos
  • Some other HTML documents, etc.
There are two types of file paths:
  1. Absolute File Paths
  2. Relative File Paths

Absolute File Paths


 Absolute File Path specifies full URL to an image or a file.

Example: <img src="https://www.photo-bucket.com/images/picture1.jpg" alt="Book">

Relative File Paths


 Relative File Path refers to a file path relative to the current page or directory you are in. Some examples and cases which will let you understand this concept are mentioned below.

  1. When image or some other file is located in the current working directory.

    Example: <img src="picture1.jpg" alt="Book">

  2. When image or some other file is located in images or some other folder in the current working directory.

    Example: <img src="images/picture1.jpg" alt="Book">

  3. When image or some other file is located at the root of the current project.

    Example: <img src="/picture1.jpg" alt="Book">

  4. When image or some other file is located in images or some other folder in the root of the current project.

    Example: <img src="/images/picture1.jpg" alt="Book">

  5. When image or some other file is located in a folder(let say images folder) one level above the current folder.

    . represents the current directory and .. would be one level up

    Example: <img src="../images/picture1.jpg" alt="Book">