Maison > Article > interface Web > Qu’est-ce qu’une feuille de style externe en CSS ?
Qu’est-ce qu’une feuille de style externe en CSS ?
- 青灯夜游original
- 2020-11-13 16:37:286781parcourir
En CSS, si le style CSS est placé dans un fichier en dehors du document de page Web, on l'appelle une feuille de style externe. Un document de feuille de style CSS représente une feuille de style externe CSS utilisée par les fichiers ; . CSS", et un lien vers l'emplacement de ce fichier est inclus dans le document HTML afin que les navigateurs Web sachent où trouver le style.
[Tutoriel recommandé : Tutoriel vidéo CSS]
Quand un navigateur Web charge une page Web, comment cela se passe affiché En fonction des informations contenues dans les feuilles de style en cascade, les fichiers HTML disposent de trois manières d'utiliser les feuilles de style : externe, interne et en ligne.
Les feuilles de style internes et intégrées sont stockées dans le fichier HTML lui-même. Ils sont faciles à utiliser pour le moment, mais comme ils ne sont pas stockés dans un emplacement central, il n'est pas possible de modifier facilement les styles sur l'ensemble du site simultanément ; vous devez revenir à chaque entrée et la modifier manuellement.
Si le style CSS est placé dans un fichier en dehors du document de page Web, on parle de feuille de style externe. Un document de feuille de style CSS représente une feuille de style externe.
En fait, une feuille de style externe est un fichier texte avec l'extension .css. Lorsque vous copiez le code de style CSS dans un fichier texte et que vous l'enregistrez en tant que fichier .css, il s'agit d'une feuille de style externe.
Comme indiqué ci-dessous, la feuille de style externe en ligne (http://c.biancheng.net/templets/new/style/common.css) :
Les fichiers de feuilles de style externes CSS utilisent l'extension de fichier .CSS et un lien vers l'emplacement du fichier est inclus dans le document HTML afin que les navigateurs Web sachent où trouver les instructions de style.
Un ou plusieurs documents peuvent être liés au même fichier CSS, et un site Web peut avoir de nombreux fichiers CSS uniques utilisés pour styliser différentes pages, tableaux, images, etc.
Comment créer un lien vers une feuille de style externe CSS ?
Chaque page Web qui souhaite utiliser une feuille de style externe spécifique doit créer un lien vers le fichier CSS dans la section
, comme ceci :<head> <link rel =“stylesheet”type =“text / css”href =“styles.css”> </head>
Dans cet exemple, La seule chose qui doit être modifiée pour que cela fonctionne pour votre propre document est le texte styles.css, qui correspond à l'emplacement du fichier CSS.
Si le fichier s'appelle réellement styles.css et se trouve exactement dans le même dossier que le document qui y est lié, alors il peut rester exactement tel qu'il est indiqué ci-dessus. Cependant, votre fichier CSS peut porter un autre titre, auquel cas vous pouvez simplement changer le nom de « styles » en votre nom.
Si le fichier CSS n'est pas à la racine de ce dossier, mais dans un sous-dossier, il peut lire ce qui suit :
<head> <link rel =“stylesheet”type =“text / css”href =“styles \ menus \ black.css”> </ head>
Concernant les fichiers CSS externes Plus d'infos
Le plus grand avantage des feuilles de style externes est qu'elles ne sont liées à aucune page spécifique. Si les styles sont exécutés en interne ou en ligne, les autres pages du site ne peuvent pas pointer vers ces préférences de style.
Cependant, en utilisant des styles externes, le même fichier CSS peut être utilisé pour chaque page du site Web, de sorte que toutes les pages aient une apparence unifiée et que la modification du contenu CSS pour l'ensemble du site Web soit très simple et centralisée.
Vous pouvez voir comment cela fonctionne ci-dessous...
Les styles internes doivent utiliser la balise
Cependant, puisque les feuilles de style externes sont contenues dans leurs propres fichiers, elles peuvent être créées comme ceci, ce qui signifie exactement la même chose que l'exemple ci-dessus :body {
background-color: green;
}
h1 {
color: blue;
margin-left: 15px;
}Dans ces exemples, inline Le style ne s'applique qu'à cette page particulière, apparemment parce qu'elle est incluse dans les détails de l'en-tête de cette page HTML. Dans le deuxième exemple, les informations CSS sont autonomes dans le fichier CSS et n'importe quelle page peut y accéder à l'aide du code de la section Comment créer un lien vers une feuille de style externe ci-dessus. Pour plus de connaissances liées à la programmation, veuillez visiter : Site Web d'apprentissage en programmation ! !
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!