File relative path in Web Development

In general, if you need to reference documents and materials outside the current website, we should use absolute paths. When referencing documents and materials inside the current website, we should use relative paths. Because the relative path does not contain the website address and other information, it makes the website easier to transplant (for example, to change the website domain name). Therefore, although you can also use the absolute path to link documents on the same website, however, use relative paths whenever possible. In general, when creating an internal link, we should try to use the relative path of the document instead of the root relative path. The reason for this is that when you preview the website locally, the browser does not recognize the root directory of the current site as a server, which may cause a link error. This problem does not occur when you use the relative path of the document.
However, in some cases, it is better to use the root relative path. If you reference an intra-site clip (for example, an image under a custom file) in the copyright information ), due to the copyright informationCodeThe relative path of a document cannot be used for multiple webpages under different directories (for example, they are used by both the home page and the first-level page, you can get the correct result by using the root relative path (of course, this "correct" means it is correct on the uploaded website ).

Write relative paths on webpages: Use the relative path of the referenced document or clip relative to the current page, for example, reference the clip "/home/www/A/index.htm" on the "/home/www/A/images/a.jpg" page. The relative path should be ". /images/a.jpg "or" images/a.jpg ".

Write the relative path in the JS file:A js file is an external Javascript file referenced on the page. JavaScript code may be used to generate HTML code. Because the generated HTML code is embedded in the page that references this JS file, when describing relative paths, you should use relative paths between referenced documents or materials and pages that reference JS files. For example, the file "/home/www/A/index.htm" references the JS file "/home/www/A/JS/hello. JS, and generate an HTML code in the reference material "/home/www/A/images/1.jpg" in this JS, in this code, the relative path should be ". /images/1.jpg "or" images/1.jpg ", but not" .. /images/1.jpg ".

Write relative paths in the CSS file:A css file is an external style definition file referenced on a page, this file is usually used to define the Display Effect of Various HTML tags on the page (such as the text font name, font size, indentation, margin, and so on ), CSS files can also reference external materials or documents (for example, setting a background image of a div object ). Unlike JS files, the browser regards CSS files as an independent document. Therefore, reference to materials in CSS can be achieved by calculating the relative path between the material file and the CSS file, it is irrelevant to the location of the page that references the CSS file. For example, the "/home/www/A/index.htm" file references the CSS file "/home/www/A/CSS/main.css ", if the reference material "/home/www/A/images/1.jpg" is referenced in the CSS, the relative path referenced by the reference material should be ".. /images/1.jpg "instead of". /images/1.jpg "or" images/1.jpg ".