Maison > interface Web > tutoriel CSS > Comment lier des fichiers CSS et de polices externes à partir de différents dossiers dans le développement Web ?

Comment lier des fichiers CSS et de polices externes à partir de différents dossiers dans le développement Web ?

Susan Sarandon
Libérer: 2024-11-30 01:57:13
original
771 Les gens l'ont consulté

How to Link External CSS and Font Files from Different Folders in Web Development?

Lier des ressources externes dans des répertoires de fichiers

Un défi courant dans le développement Web consiste à lier des ressources externes telles que des feuilles de style et des polices lorsque leurs emplacements diffèrent de le document HTML principal. Dans cet article, nous explorerons les techniques pour lier ces éléments dans des scénarios où ils résident dans des dossiers séparés.

Lier un fichier CSS à partir d'un dossier différent

Pour lier une feuille de style d'un autre dossier, utilisez la syntaxe suivante :

<link href="filepath/stylesheet.css" rel="stylesheet">
Copier après la connexion

Remplacez "filepath" par le chemin relatif du fichier CSS. Par exemple, si le fichier CSS se trouve dans un dossier nommé « styles » dans le dossier « assets », le chemin serait :

<link href="assets/styles/stylesheet.css" rel="stylesheet">
Copier après la connexion

Lien d'un fichier CSS Font-Face

Pour lier un fichier CSS font-face à partir d'un dossier différent, suivez une approche similaire :

<link href="filepath/font-face.css" rel="stylesheet">
Copier après la connexion

Par exemple, si le Le fichier CSS font-face se trouve dans le dossier "fonts" du dossier "assets", le chemin serait :

<link href="assets/fonts/font-face.css" rel="stylesheet">
Copier après la connexion

Liaison des polices à l'aide de l'attribut src

Dans le fichier CSS font-face, vous devez spécifier les fichiers de polices à l'aide de l'attribut src. Les chemins de fichiers doivent être relatifs à l'emplacement du fichier CSS font-face. Par exemple, si les fichiers de polices se trouvent dans le dossier « font1 » du dossier « fonts », l'attribut src serait :

@font-face {
  font-family: 'Font1';
  src: url('font1/font1.ttf') format('truetype');
}
Copier après la connexion

Cette approche garantit que vos feuilles de style et vos polices sont correctement liées, quel que soit le leur emplacement dans la structure du fichier.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal