HTML 文件路径上是否需要“./”和“../”?
Do I need "./" and "../" on HTML files paths?
我在 href
和 src
等属性中使用相对 URL。我真的需要在路径前使用 ./
和 ../
才能正确建立 link 吗?
当我完成编码 index.html 后,我复制代码并将其用于我项目的其他 .html 文件。我发现必须纠正每条路径令人沮丧。
我的项目文件夹结构如下:
website-project folder
index.html
css folder
style.css
img folder
image.png
about folder
about.html
如果我使用 index.html
代码启动 about.html
,我需要更改从 ./
到 ../
的每条路径。使用 "Find & Replace" 工具使它更容易,但如果我可以 link 到基于根文件夹而不是当前文件夹的路径,它仍然会更好。例如:
使用
href="website-project/img/image.png"
inside about.html
会将 link 变为 website-project/img/image.png
而不是 website-project/about/img/image.png
,这会导致错误。
2016 年 7 月 7 日更新
在 index.html
页面内,如果我使用 href="/about/about.html
而不是 link 创建 <a>
到:
file:///home/guizo/Documents/website-project/about.html
它 link 到:
file:///about/about.html
其他人也是如此links:
尝试使用
href="/img/image.png"
/
指的是你的根目录。
编辑:
以上不适用于本地静态网站。在这些情况下,您应该尝试使用 <BASE href />
标签,该标签链接到一个固定的基地址。可以按如下方式使用:
对于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>
对于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>
试试这个“/img/image.png”。 / 代表站点的根目录。
我在 href
和 src
等属性中使用相对 URL。我真的需要在路径前使用 ./
和 ../
才能正确建立 link 吗?
当我完成编码 index.html 后,我复制代码并将其用于我项目的其他 .html 文件。我发现必须纠正每条路径令人沮丧。
我的项目文件夹结构如下:
website-project folder
index.html
css folder
style.css
img folder
image.png
about folder
about.html
如果我使用 index.html
代码启动 about.html
,我需要更改从 ./
到 ../
的每条路径。使用 "Find & Replace" 工具使它更容易,但如果我可以 link 到基于根文件夹而不是当前文件夹的路径,它仍然会更好。例如:
使用
href="website-project/img/image.png"
inside about.html
会将 link 变为 website-project/img/image.png
而不是 website-project/about/img/image.png
,这会导致错误。
2016 年 7 月 7 日更新
在 index.html
页面内,如果我使用 href="/about/about.html
而不是 link 创建 <a>
到:
file:///home/guizo/Documents/website-project/about.html
它 link 到:
file:///about/about.html
其他人也是如此links:
尝试使用
href="/img/image.png"
/
指的是你的根目录。
编辑:
以上不适用于本地静态网站。在这些情况下,您应该尝试使用 <BASE href />
标签,该标签链接到一个固定的基地址。可以按如下方式使用:
对于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>
对于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>
试试这个“/img/image.png”。 / 代表站点的根目录。