Common HTML file path setting methods

Paths can be used in HTML to link to other pages, insert pictures, embed style sheets, etc. The path settings are different between different files. The following is a common way to set the path of HTML files.

1. Relative path

A relative path is a path relative to the directory where the current file is located. Relative paths can simplify code and facilitate file management. The following are several common ways to set relative paths.

1.1. Link to other pages

To link to other HTML files in the same directory, you can directly write the file name.

<a href="page2.html">Page 2</a>

To link to an HTML file in the parent directory (upper level), you can add two dots ".." before the file name.

<a href="../page1.html">Page 1</a>

Note: ".." represents the upper-level directory. Multiple dots can be used to represent multi-level directories. For example, "../../" represents the two-level directories above.

1.2. Insert pictures

To insert pictures in the same directory, you can directly write the picture name.

<img src="image.jpg" alt="My Image">

To insert a picture in the parent directory, you can add two dots ".." before the picture name.

<img src="../image.jpg" alt="My Image">

1.3. Embed style sheet

To embed a style sheet in the same directory, just write the style sheet file name directly in the HTML file.

<link rel="stylesheet" href="style.css">

To embed a style sheet in the parent directory, you can add two dots ".." before the style sheet file name.

<link rel="stylesheet" href="../style.css">

2. Absolute path

The absolute path is the full path starting from the domain name and can be used in any file. The following are several common ways to set absolute paths.

2.1. Link to other pages

To link to other HTML files under the same domain name, you can directly write the full URL of the link.

<a href="http://www.example.com/page2.html">Page 2</a>

2.2. Insert a picture

To insert a picture under the same domain name, you can directly write the complete URL of the picture.

<img src="http://www.example.com/image.jpg" alt="My Image">

2.3. Embed style sheet

To embed a style sheet under the same domain name, write the full URL of the style sheet file directly in the HTML file.

<link rel="stylesheet" href="http://www.example.com/style.css">

Note: Using absolute paths will make the code verbose and increase web page loading time, so it is not recommended to use it too much.

Summary

The above are common ways to set HTML paths. A relative path determines the path for linking, inserting pictures, and embedding style sheets based on the location of the current file, while an absolute path is the complete path starting from the domain name. Choosing the appropriate path method based on specific file locations and needs can simplify code, facilitate file management, and improve web page loading speed.

The above is the detailed content of Common HTML file path setting methods. For more information, please follow other related articles on the PHP Chinese website!