Detailed explanation of absolute path and relative path

For example, there are two files file1 and file2 in the ABC folder of your C drive.

If you let the file file1 tell the location (that is, the path) of file2, then it has two ways of representation: The
first one: C:\ABC\file2 This is the absolute path, indicating that the file2 file is under the ABC file of C drive, from The largest directory C drive began to show.
The second type: file2 This is the relative path, because file1 and file2 are under C:\ABC, so their path before "C:\ABC" is the same, so there is no need It shows up.


When the page is uploaded to the server, there will always be errors such as not seeing the picture, css style sheet failure, etc. In this case, it is mostly because you have used the wrong path, and the absolute path is used where the relative path should be used. As a result, the browser cannot open the specified file in the specified location.

  Let's talk about the difference between relative path and absolute path, which is the most troublesome for beginners.

  What is an absolute path:

  Everyone knows that we must know the location of the file when we use the computer to find the required file, and the way to indicate the location of the file is the path, for example, as long as we see this path: c:/website/img/photo.jpg You know that the photo.jpg file is in the img subdirectory under the website directory of the c drive. The path similar to this complete description file location is the absolute path. We do not need to know any other information to determine the location of the file based on the absolute path. In the website, the way to determine the file location similar to http://www.pckings.net/img/photo.jpg is also an absolute path.

  In addition, in website applications, we usually use "/" to indicate the root directory, and /img/photo.jpg means that the photo.jpg file is in the img directory on the root directory of the website. But such use is risky for beginners, because you must know that the root directory referred to here is not the root directory of your website, but the root directory of the server where your website is located, so when the root directory of the website When it is different from the server root directory, an error occurs.


  What is a relative path:

  Let us first analyze why the picture cannot be displayed normally. For example, there is a page index.htm, and a picture photo.jpg is connected to this page. Their absolute path is as follows:
  c:/website/index.htm
  c:/website/img/photo.jpg

  If you use the absolute path c:/website/img/photo.jpg, everything will be normal on your computer, because you can indeed find the photo.jpg file at the specified location, c:/website/img/photo.jpg , But when you upload the page to the website, it is very likely to make a mistake, because your website may be in the c drive of the server, may be in the d drive, or in the aa directory, and more likely in the bb directory. In short, there is no The reason there is a path like c:/website/img/photo.jpg. So, what kind of path should be used to locate the photo.jpg file in the index.htm file? Yes, it should be a relative path, the so-called relative path, as the name implies, is the relative position of oneself to the target. In the above example, the linked photo.jpg in index.htm can use img/photo.jpg to locate the file, so no matter where these files are placed, as long as their relative relationship remains unchanged, there will be no error.

  In addition, we use "../" to indicate the upper level directory, "../../" to indicate the upper level directory, and so on. (Friends who have studied dos may be easier to understand)

  Look at a few more examples. Note that in all examples, there is a picture photo.jpg connected to the index.htm file.

  Example:
  c:/website/web/index.htm
  c:/website/img/photo.jpg
  In this example, how should the photo.jpg linked in index.htm be represented?
  Wrong writing: img/photo.jpg
  is incorrect. In this example, for the index.htm file, the absolute path represented by img/photo.jpg is: c:/website/web/img/photo .jpg, obviously does not meet the requirements.
  Correct writing: use the relative path of ../img/photo.jpg to locate the file


  Example:
  c:/website/web/xz/index.htm
  c:/website/img/images/photo.jpg
  In this example, how should the photo.jpg linked in index.htm be represented?
  Wrong way of writing: ../img/images/photo.jpg
  This way of writing is incorrect. In this example, for the index.htm file ../img/images/photo.jpg represents the absolute path: c :/website/web/img/images/photo.jpg.
  Correct writing: You can use the relative path of ../../img/images/photo.jpg to locate the file


  Example:
  c:/website/web/xz/index.htm
  c:/website/web/img/photo.jpg
  In this example, how should the photo.jpg linked in index.htm be represented?
  Wrong writing: ../../img/photo.jpg
  is incorrect. In this example, for the index.htm file, the absolute path represented by ../../img/photo.jpg is : C:/website/img/photo.jpg.
  Correct writing: You can use the relative path of ../img/photo.jpg to locate the file


  Summary: Through the above example, it can be found that when the absolute path is converted to a relative path, the same parts in the absolute path of the two files can be ignored and not considered. Just consider the differences between them.
Finally, in order to avoid path errors when making web pages, we can use dreamweaver's site management function to manage the site. As long as you use the menu command site-new site to create a new site and define the site directory, it will automatically convert the absolute path to a relative path, and when you move files on the site, the connection paths associated with these files will automatically change. It is very convenient.

 

Absolute path, starting from the root directory to the directory where you are;
relative path, starting from a directory to the directory where you are.

For example:
             ┍ A folder
          C -|
             ┕ B folder

Absolute path: C:\A folder

Relative path (if you are in the B folder): ..\B folder ('..\' means one level up)
 

Guess you like

Origin blog.csdn.net/chudelong1/article/details/90697409