What is an absolute path and a relative path

The concept of absolute and relative paths is involved in HTML wherever a file is involved (such as hyperlinks, pictures, and so on).

　　1. Absolute path

An absolute path is a path that a file really exists on the hard disk. For example, "bg.jpg" This picture is stored in the hard disk "E:book page layout Code 2nd" directory, then "bg.jpg" the absolute path of this picture is "E:book page cloth Code 2nd Chapter Bg.jpg." If you want to use an absolute path to specify a background picture for a Web page, you should use the following statement:

　　2. Disadvantages of using absolute paths

In fact, when you're programming a Web page, you rarely use an absolute path, and if you use the "E:book Web Code 2nd Chapter Bg.jpg" To specify the location of the background picture, browsing on your own computer may be all right, but browsing through the Web server will probably not show the picture. Because when uploading to a Web server, it is possible that the entire site is not placed on the Web server's e-disk, possibly D or h disk. Even if placed on the Web server e disk, the Web server's e disk does not necessarily exist in the "E:book page layout Code 2nd" This directory, so when browsing the Web page will not show the picture.

　　3. Relative path

To avoid this, a relative path is usually selected when a file is specified in a Web page. The so-called relative path, is relative to their own target file location. For example, the above example, "s1.htm" file refers to the "bg.jpg" picture, because the "bg.jpg" picture is in the same directory as "S1.htm", then to use the following code in the "s1.htm" file, as long as the relative position of the two files has not changed ( In other words, in the same directory, you can display the picture correctly in the browser regardless of where you upload it to the Web server.

To take another example, suppose the "s1.htm" file is located in the directory of "E:book page layout Code 2nd", and "bg.jpg" picture is located in the directory "E:book page layout Code 2nd img", then "bg.jpg" picture relative to the "s1.htm" file, is in the "IMG" subdirectory of its directory, the statement referencing the picture should be:

Note: The relative path uses the "/" character as the separator character for the directory, and the absolute path can use the "" or "/" character as the separator character for the directory. Because the "IMG" Directory is a subdirectory under the "2nd Chapter" directory, you do not need to add the "/" character before "IMG".

Often used in relative paths. /"to represent the previous level of the directory. If you have more than one level of directory, you can use multiple ".. /", for example,". /.. /"represents the upper parent directory. If the "s1.htm" file is located in the directory of "E:book page layout Code 2nd" and the "bg.jpg" picture is in the directory "E:book page layout Code", then the "bg.jpg" picture is in the parent directory of its directory, as opposed to the "s1.htm" file, The statement that refers to the picture should be:

To take another example, suppose the "s1.htm" file is located in the directory of "E:book page layout Code 2nd", and "bg.jpg" picture is located in the directory of "E:book Page layout code img", then "bg.jpg" picture relative to the "s1.htm" file, is in the "IMG" subdirectory of the parent directory of its directory, the statement referencing the picture should be:

　　4. Relative Virtual directory

There is also a more specific representation of relative paths: "Relative virtual directories." Take a look at the following example:

In this example, the value of the Background property is "/img/bg.jpg", noting that there is a "/" character before "IMG". This "/" represents the root directory of the virtual directory. Assuming that the "E:book page layout Code" is set as a virtual directory, then the true path of "/img/bg.jpg" is "E:book page layout code img/bg.jpg"; If you put "E:book page layout Code 2nd" Set as virtual directory, then "/img/bg.jpg" The True Path is "E:book page layout Code 2nd Chapter Img/bg.jpg"