HTML 文件路径上是否需要“./”和“../”？答案

【问题标题】：Do I need "./" and "../" on HTML files paths?HTML 文件路径上是否需要“./”和“../”？
【发布时间】：2016-11-08 01:05:40
【问题描述】：

我在 href 和 src 等属性中使用相对 URL。我真的需要在路径正确建立链接之前使用./ 和../ 吗？

完成 index.html 的编码后，我复制代码并将其用于我项目的其他 .html 文件。我发现必须纠正每条路径令人沮丧。

我的项目文件夹结构如下：

website-project folder
      index.html

      css folder
          style.css

      img folder
           image.png

      about folder
          about.html

如果我使用index.html 代码启动about.html，我需要将每条乞求路径从./ 更改为../。使用“查找和替换”工具会更容易，但如果我可以链接到基于根文件夹而不是当前文件夹的路径，那会更好。例如：

使用

href="website-project/img/image.png"

在about.html 内部会链接到website-project/img/image.png 而不是website-project/about/img/image.png，这会导致错误。

2016 年 7 月 7 日更新

如果我用href="/about/about.html 而不是链接到<a>，则在index.html 页面内：

file:///home/guizo/Documents/website-project/about.html

它链接到：

file:///about/about.html

其他链接也是如此：

【问题讨论】：

这可能会对您有所帮助：stackoverflow.com/questions/27218879/…

标签： html hyperlink path href src

【解决方案1】：

尝试使用

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>

【讨论】：

我以前试过，但对我不起作用。如果我点击Home，则在index.html 页面内，而不是链接到：file:///home/guizo/Documents/website-project/index.html 它链接到：file:///index.html 其他链接也是如此：file:///css/style.html; file:///about/about.html; file:///img/image.html
谢谢。这就是我想要的。

【解决方案2】：

试试这个'/img/image.png'。 / 代表网站的根目录。

【讨论】：