如何书写相对路径？app目录下index.html引用build/css/style.css的路径问题

首先咱们先明确你的目录结构，方便理清路径逻辑：

• 根目录
  • app/
    • index.html
    • sass/
    • img/
  • build/
    • css/
      • style.css
    • js/

问题拆解 #

你遇到的问题其实有两个关键点：

1. 路径逻辑错误：index.html 位于 app 文件夹内，要访问同级的 build 文件夹，得先跳出当前的 app 目录（用 ../ 表示上一级目录），再进入 build/css 找到目标文件。
2. 语法错误：你写的 link 标签里，href 属性后面漏写了等号（=），这会导致浏览器无法识别这个属性，自然加载不了样式。

正确代码写法 #

把代码改成下面这样就能正常引用样式文件了：

<link rel="stylesheet" type="text/css" href="../build/css/style.css">

简单解释下路径：

• ../：表示从当前文件（index.html）所在的 app 目录，回到包含 app 和 build 的根目录
• 后续的 build/css/style.css：就是从根目录出发到目标样式文件的完整路径

内容的提问来源于stack exchange，提问作者Andrew