没有当前目录的相对路径

Question

大家好，我有一个带有以下标记的html文件：

<link rel="stylesheet" href="/lib/css/classic.css">

问题是，当我在浏览器中打开文件时，它抱怨没有找到classic.css文件，而是将当前目录添加到href的开头：

<link rel="stylesheet" href="./lib/css/classic.css">

它能正常工作，而且更糟的是，我有一堆类似的文件，每个文件都有数十个这些相对路径，我该如何解决此问题？

Answer 1

具有讽刺意味的是，这与 the first question I asked on SO 非常相似。

目前，您是从localhost开始工作的，因此CSS文件是从file://协议加载的。当您将代码移至托管网站时，这些链接将自动以根目录相对前缀（/）为您解析。

为了让他们在localhost上工作，您有很多选择：

• 充分利用子域。根被认为是子域的根。也就是说，site.localhost将解析链接/lib/css/classic.css（尽管localhost/site不会）。在这种情况下，您需要将服务器配置为使用 Virtual Name Hosting 。
• 使用相对的<link>，并使用../向上移动。可能看起来像：
  <link rel="stylesheet" href="current/../lib/css/style.css" />
• 只需使用大量遍历，即可确保您打到文档根目录并从那里开始工作：
  <link rel="stylesheet" href="../../../../../lib/css/style.css" />
• 设置 <base> URL 并使用其中的相对链接：
  <base href="/lib/css">
<link rel="stylesheet" href="style.css" />

我建议自己使用第四个选项，尽管可能需要一些调整。