Home > Web Front-end > Front-end Q&A > Common HTML file path setting methods

Common HTML file path setting methods

PHPz
Release: 2023-04-21 14:24:47
Original
2176 people have browsed it

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>
Copy after login

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>
Copy after login

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">
Copy after login

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

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

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">
Copy after login

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">
Copy after login
  1. 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>
Copy after login

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">
Copy after login

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">
Copy after login

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!

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template