Difference between relative path and absolute path

In HTML, wherever files are involved (such as hyperlinks, pictures, etc.), the concepts of absolute paths and relative paths are involved.

1. Absolute path
    The absolute path refers to the path where the file actually exists on the hard disk. For example, the picture "bg.jpg" is stored in the "E:\book\page layout code\Chapter 2" directory of the hard disk, then the absolute path of the picture "bg.jpg" is "E:\book\page layout" \code\Chapter 2\bg.jpg". Then if you want to use an absolute path to specify the background image of a web page, you should use the following statement:
<body backround="E:\book\page layout\code\chapter 2\bg.jpg" >

2. The disadvantage of using an absolute path is
   actually , In web programming, absolute paths are rarely used. If you use "E:\book\webpage\code\chapter 2\bg.jpg" to specify the location of the background image, browsing on your own computer may be everything It is normal, but it is very likely that the pictures will not be displayed after uploading to the Web server for browsing. Because when uploading to the Web server, the entire website may not be placed on the E disk of the Web server, but may be the D disk or the H disk. Even if it is placed in the E disk of the web server, the directory "E:\book\webpage layout\code\Chapter 2" may not exist in the E disk of the web server, so the pictures will not be displayed when browsing the web page. .

3. Relative paths
    In order to avoid this situation, relative paths are usually used when specifying files in web pages. The so-called relative path is relative to its own target file location. For example, in the above example, the "bg.jpg" picture is referenced in the "s1.htm" file. Since the "bg.jpg" picture is in the same directory as "s1.htm", it must be in the "s1.htm" file. After using the following code in the .htm" file, as long as the relative positions of the two files have not changed (that is, they are still in the same directory), no matter where they are uploaded to the web server, they will be displayed correctly in the browser. display image.
      <body background="bg.jpg">For
another example, suppose the directory where the "s1.htm" file is located is "E:\book\Webpage Layout\Code\Chapter 2", and the directory where the "bg.jpg" image is located It is "E:\book\page layout\code\Chapter 2\img", then the "bg.jpg" picture is in the "img" subdirectory of the directory where it is located, relative to the "s1.htm" file, Then the sentence to refer to the picture should be:
      <body background="img/bg.jpg">

    Note: The relative path uses the "/" character as the separation character of the directory, and the absolute path can use the "\" or "/" character as the directory separator character. Since the "img" directory is a subdirectory of the "Chapter 2" directory, there is no need to add the "/" character before "img".
In relative paths, "../" is often used to represent the upper level directory. If there are multiple upper-level directories, multiple "../" can be used, for example, "http://www.cnblogs.com/" represents the upper-level directory. Assuming that the directory where the "s1.htm" file is located is "E:\book\page layout\code\Chapter 2", and the directory where the "bg.jpg" picture is located is "E:\book\page layout\code", then " bg.jpg" image is in the upper-level directory of the directory where it is located compared to the "s1.htm" file, so the sentence quoting the image should be:
      <body background="../bg.jpg">

Cite another one For example, suppose the directory where the "s1.htm" file is located is "E:\book\page layout\code\Chapter 2", and the directory where the "bg.jpg" image is located is "E:\book\page layout\code\img" ", then the "bg.jpg" picture is in the "img" subdirectory of the parent directory of the directory where the "bg.jpg" file is compared to the "s1.htm" file, then the sentence referencing the picture should be:
      <body background="../img/bg.jpg">

4. Relative virtual directory There is also a special expression
for relative paths: "relative virtual directory". Take a look at the following example:
      <body background="/img/bg.jpg">

In this example, the value of the background property is "/img/bg.jpg", notice that there is a "/" character before "img" . This "/" represents the root directory of the virtual directory. Assuming that "E:\book\page layout\code" is set as a virtual directory, then the real path of "/img/bg.jpg" is "E:\book\ web layout\code\img\bg.jpg"; if "E:\book\web layout\code\Chapter 2" is set as a virtual directory, then the real path of "/img/bg.jpg" is "E: \book\Webpage layout\Code\Chapter 2\img\bg.jpg"

Note: The article is transferred from Blog Garden http://www.cnblogs.com/heyonggang/archive/2013/03/01/2938984.html

Difference between relative path and absolute path

Guess you like