检查此quick reminder of file path
以下是您需要了解的有关相对文件路径的所有信息：

• 以“/”开头将返回根目录并从那里开始
• 从“../”开始向后移动一个目录并从那里开始
• 从“../../”开始向后移动两个目录并从那里开始（以此类推...）
• 要向前移动，只需从第一个子目录开始并继续向前移动

我不是很清楚，你想链接一个外部的css作为你上面定义的文件结构吗？如果是，那么就使用link标签：

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

所以基本上对于你网站文件夹下的文件（包含你的索引的文件夹）你直接调用它。对于每个连续的文件夹使用“/”，例如在你的情况下：

<link rel="stylesheet" type="text/css" href="Fonts/Font1/file name">
    <link rel="stylesheet" type="text/css" href="Fonts/Font2/file name">

我觉得你应该做的是

<link rel="stylesheet" type="text/css" href="font/font-face/my-font-face.css">

当css在不同的文件夹中时，为那些找不到css链接到html的答案的人更新。你只需要把.（点）放在href中的所有内容之前。我有这样的href="./public/css/styles.css”，但是主html index.html我在主文件夹中，那里是所有内容。这至少对我来说是这样工作的。

<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

.tree-view-com ul li {
  position: relative;
  list-style: none;
}
.tree-view-com .tree-view-child > li{
  padding-bottom: 30px;
}
.tree-view-com .tree-view-child > li:last-of-type{
  padding-bottom: 0px;
}
 
.tree-view-com ul li a .c-icon {
  margin-right: 10px;
  position: relative;
  top: 2px;
}
.tree-view-com ul > li > ul {
  margin-top: 20px;
  position: relative;
}
.tree-view-com > ul > li:before {
  content: "";
  border-left: 1px dashed #ccc;
  position: absolute;
  height: calc(100% - 30px - 5px);
  z-index: 1;
  left: 8px;
  top: 30px;
}
.tree-view-com > ul > li > ul > li:before {
  content: "";
  border-top: 1px dashed #ccc;
  position: absolute;
  width: 25px;
  left: -32px;
  top: 12px;
}

<div class="tree-view-com">
    <ul class="tree-view-parent">
        <li>
            <a href=""><i class="fa fa-folder c-icon c-icon-list" aria-hidden="true"></i> folder</a>
            <ul class="tree-view-child">
                <li>
                    <a href="" class="document-title">
                        <i class="fa fa-folder c-icon" aria-hidden="true"></i>
                        sub folder 1
                    </a>
                </li>
                <li>
                    <a href="" class="document-title">
                        <i class="fa fa-folder c-icon" aria-hidden="true"></i>
                        sub folder 2
                    </a>
                </li>
                <li>
                    <a href="" class="document-title">
                        <i class="fa fa-folder c-icon" aria-hidden="true"></i>
                        sub folder 3
                    </a>
                </li>
            </ul>
        </li>
    </ul>
</div>