The difference between absolute path and relative path in HTML

Time:2021-4-30

As shown in the figure:

For the connection of a single page under many files, you need to have a certain understanding of the path when referring to files; Or programmers who have knowledge of PHP network program development will have a lot of opinions on the combination of define and include to define variable path and reference.

For example:

Copy code

The code is as follows:

define(‘ROOT_PATH’,dirname(__FILE__));
include(ROOT_PATH.”/inc/webconfig.php”);
include(ROOT_PATH.”/inc/sysinfo.php”);
include(ROOT_PATH.”/inc/functions.php”);
include(ROOT_PATH.”/inc/db_sql.php”);

These are my next analysis.

Main contents:

The concept of relative path and absolute path
Specific analysis
The concept of relative path and absolute path

This is what the operating system class said. In terms of file search, absolute path: in the tree directory structure, there is only one unique path from the root node to a data file or directory file. Connect the directory file name and data file name on the path from the root node to a data file with a ‘/’ to form the path name that can be used to access the data file; Relative path: you can set a “current directory” for each process, also known as the “working directory”. In this way, you do not need to use the absolute path mechanically every time you search for a file. Instead, you use the path of the file relative to the current directory. This is the relative path. Of course, it’s a bit abstract. Please see my analysis below. It’s mainly used in HTML

make a concrete analysis

HTML beginners will often encounter such a problem, how to correctly reference a file. For example, how to refer to another HTML page as a hyperlink in an HTML page? How to insert a picture in a web page?

If you use the wrong file path when referring to a file (such as adding a hyperlink or inserting an image), the reference will be invalid (unable to browse the linked file or display the inserted image, etc.).

To avoid these errors and correctly reference files, we need to learn about the HTML path.

There are two ways to write HTML: relative path and absolute path.

HTML relative path

File references in the same directory

If the source file and the reference file are in the same directory, write the name of the reference file directly.

Now we will create a source file info. HTML. In info. HTML, we will refer to the index. HTML file as a hyperlink.

Suppose that the path of info.html is: C:: (inetpub)  wwwroot  sites  blablabla  info.html suppose that the path of index.html is: C:  inetpub  wwwroot  sites  blablabla  index.html add the code of index.html hyperlink to info.html as follows:

How to represent a superior directory
The directory above the directory where the source file is located, https://www.jb51.net/ Represents the superior directory of the directory where the source file is located, and so on.

Suppose that the path of info.html is: C:: (inetpub) wwwroot (sites) blablabla (info.html) suppose that the path of index.html is: C:: (inetpub) wwwroot (sites) index.html add the code of index.html hyperlink to info.html as follows:

The following is the code to add the index.html hyperlink to the info.html:

<a href = ” https://www.jb51.net/index.html “> index. HTML < / a > assume that the path of info.html is: C:: (inetpub)  wwwroot  sites  blablabla  info.html assume that the path of index.html is: C:  inetpub  wwwroot  sites  wowstory  index.html

<a href = “../wowstory/index.html”>index.html</a>
How to represent a child directory
Refer to the file of the lower directory, and write the path of the file of the lower directory directly.

Suppose the path of info.html is: C:: (inetpub)  wwwroot  sites  blablabla  info.html suppose the path of index.html is: C:  inetpub  wwwroot  sites  blablablabla  HTML  index.html add the code of index.html hyperlink to info.html as follows:

<a href = “html/index.html”>index.html</a>

Suppose that the path of info.html is: C:: (inetpub)  wwwroot  sites  blablabla  info.html suppose that the path of index.html is: C:  inetpub  wwwroot  sites  blablablabla  index.html add the code of index.html hyperlink to info.html as follows:

< a = “HTML / tutorials / index. HTML” > index. HTML < / a > HTML absolute path
HTML absolute path refers to the complete path of a file with a domain name.

Suppose you register a domain name www.jb51.net , and applied for a virtual host. Your virtual host provider will give you a directory, such as WWW, which is the root directory of your website.

Suppose you put a file index.html in the root of www. the absolute path of this file is: https://www.jb51.net/index.html .

Suppose you create a directory called HTML under the root of www_ Then put a file index. HTML in the directory. The absolute path of this file is https://www.jb51.net/html_ tutorials/index.html。

Some references:The difference between relative path and absolute path

Recommended Today

Large scale distributed storage system: Principle Analysis and architecture practice.pdf

Focus on “Java back end technology stack” Reply to “interview” for full interview information Distributed storage system, which stores data in multiple independent devices. Traditional network storage system uses centralized storage server to store all data. Storage server becomes the bottleneck of system performance and the focus of reliability and security, which can not meet […]