Link a .css on another folder

Question

I have some questions about how to link things.

Imagine that I have a folder \"Website\" where my files for that website are stored, and another folder with fonts, a

Answer 1

check this quick reminder of file path

Here is all you need to know about relative file paths:

• Starting with "/" returns to the root directory and starts there
• Starting with "../" moves one directory backwards and starts there
• Starting with "../../" moves two directories backwards and starts there (and so on...)
• To move forward, just start with the first subdirectory and keep moving forward

Answer 2

I think what you want to do is

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

Answer 3

I dont get it clearly, do you want to link an external css as the structure of files you defined above? If yes then just use the link tag :

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

so basically for files that are under your website folder (folder containing your index) you directly call it. For each successive folder use the "/" for example in your case :

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

Answer 4

<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>