Geek Answers Handbook

Link to .css to another folder

I have some questions on how to connect things.

Imagine that I have a “Website” folder where my files for this website are stored, as well as another font folder, and that the font folder has more folders for each font. My html and css file is located directly in the website folder. My font-face-css file is located in the / font folder.

I want to link my css file with my html file, so I do this: href = "stylesheet.css"

I also want to link my font-face-css file with my html file, so what should I put inside href = ""?

And I also want to link my fonts, which are in their own folder, which is also inside the font folder, where the css file for my font-face-css file is located, which I have to insert in src:

1 Website folder 1.1 Fonts folder (/fonts) 1.1.1 Font1 folder (/fonts/font1) 1.1.1.1 ttf file (/font/font1/font1.ttf) 1.1.1.2 svg file (/font/font1/font1.svg) 1.1.2 Font2 folder (/fonts/font2) 1.1.2.1 ttf file (/font/font1/font2.ttf) 1.1.2.2 svg file (/font/font1/font2.svg) 1.2 html file (file.html) 1.3 css file (file.css)

thanks

+12
html css fonts
source share
4 answers

I don’t understand this, do you want to link external CSS as the structure of the files you defined above? If so, just use the link tag:

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

so basically for the files under the folder of your website (the folder containing your index), you call it directly. For each subsequent folder use "/", 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">
+11
source share

check out this quick file path reminder

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

  • Starting with "/" it returns to the root directory and starts there
  • Starting with "../" moves one directory back and starts there
  • Starting with "../../" moves two directories back and runs there (and so on ...)
  • To move forward, just start from the first subdirectory and continue moving forward
+38
source share

I think you want to do

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

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

0
source share

More articles:


All Articles