Do I need “./” and “../” on HTML files paths?
Question
I'm using relative URL in attributes like href and src . Do I really need to use ./ and ../ before the paths to correctly establish the link?
When I'm done coding index.html, I copy the code and use it on others .html files of my project. I find it frustrating having to correct every path then.
My projects folder structure is like:
website-project folder
index.html
css folder
style.css
img folder
image.png
about folder
about.html
If I use index.html code to start about.html I need to change every path begging from ./ to ../ . Using "Find & Replace" tool makes it easier but still it would be nicer if I could link to paths based on the root folder and not the present folder. Ex:
Using
href="website-project/img/image.png"
inside about.html would link to website-project/img/image.png instead of website-project/about/img/image.png which leads to an error.
UPDATE JULY 07 2016
Inside index.html page if I make a <a> with href="/about/about.html instead of linking to:
file:///home/guizo/Documents/website-project/about.html
it links to:
file:///about/about.html
The same goes on for the others links:
2 answers
solution1
0 ACCPTED 2016-07-06 04:23:55
Try using
href="/img/image.png"
/ refers to your root directory.
EDIT: The above will not work for local static websites. In these cases, you should try using the <BASE href /> tag which tags links on to a fixed base address. It can be used as follows:
For index.html :
<html>
<head>
<title>index</title>
<BASE href="file:///home/guizo/Documents/website-project/" />
</head>
<body>
<a href="about/about.html">Go to about</a>
</body>
</html>
For about.html :
<html>
<head>
<title>About</title>
<BASE href="file:///home/guizo/Documents/website-project/" />
</head>
<body>
<a href="index.html">Go to index</a>
</body>
</html>
solution2
0 2016-07-06 04:25:09
try this '/img/image.png'. / represents root of the site.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.