How to Link CSS and Font Files from Different Folders in HTML?

Linking CSS and Font Files Across Folders

In the given folder structure, the task is to link a CSS file and font files from separate folders to an HTML file. To do this:

Linking the CSS File:

Open the HTML file and add the following line in the section:

This line specifies that the stylesheet.css file is located one folder above (backwards) from the HTML file.

Linking the Font-Face CSS File:

Similarly, to link the font-face CSS file, add the following line to the section:

This line points to the font-face CSS file, which is located in the "fonts" folder.

Linking the Fonts

To link the fonts in the fontstyle.css file, use the src attribute as follows:

This code specifies that the Font1 font is located in the "fonts/font1" folder and includes both a TTF and SVG version.

Remember the following guidelines when using relative file paths:

• Starting with "/" returns to the root directory.
• Starting with "../" moves one directory backward.
• Starting with "../" moves two directories backward.
• To move forward, start with the first subdirectory and continue moving forward.

The above is the detailed content of How to Link CSS and Font Files from Different Folders in HTML?. For more information, please follow other related articles on the PHP Chinese website!