Crus4

logo

HTML File Paths


A File Path specifies the location of a file inside a website’s folder structure. We can also say it’s an address of a file which helps the Web Browsers to access the files.

File Paths are mainly used to link external sources like images, videos, CSS & JS code etc. In order to insert a file in a web page its source must be known. For example (<img src=”url” alt=”alternate text”>) is used to embed an image in a web page, where the path of the image is placed in place of url. Similarly <video> element is used to insert a video in a web page.

File Paths are of two types:

  • Absolute File Paths
  • Relative File Paths

Absolute File Path

Absolute File Path specifies the full address to access an internet file

Example

https://crus4.com/wp-content/uploads/2022/08/cn.jpeg

<!DOCTYPE html>
<html>
<body>

<h3>Using a Full URL File Path</h3>
<img src="https://crus4.com/wp-content/uploads/2022/08/cn.jpeg" alt="Learn Coding " style="width:300px">

</body>
</html>

You can learn more about <img> element in our HTML Image Tutorial

Relative File Paths

It points to the path of the file that is relative to the location of the current web page file.

In an below example it shows the file present in the same folder of the current web page file.

Example

<!DOCTYPE html>
<html>
<body>

<h3>Using a Relative File Path</h3>
<img src="/images/pc.jpeg" alt="laptop" style="width:300px">

</body>
</html>


Related Posts

Add JavaScript to HTML

HTML Class Attribute

Images in HTML

HTML File Paths – crus4

One thought on “HTML File Paths – crus4

Leave a Reply

Your email address will not be published. Required fields are marked *