recherche

Maison  >  Article  >  interface Web  >  Comment référencer CSS

Comment référencer CSS

PHPz
PHPzoriginal
2023-05-14 20:25:06945parcourir

Dans la production de pages Web, CSS (Cascading Style Sheets) est un langage utilisé pour contrôler le style et la mise en page des pages Web. Il peut réaliser l'embellissement et la compatibilité des pages Web et facilite grandement le travail de développement front-end. Cet article explique comment référencer CSS.

1. Feuille de style interne

La feuille de style interne intègre la feuille de style CSS dans le document HTML. À l'aide d'une feuille de style interne, nous devons créer une balise c9ccee2e6ea535a969eb3f532ad9fe89 dans la balise 93f0f5c25f18dab9d176bd4f6de5d30e et y écrire le code CSS comme suit : 

<head>
   <style>
       h1 {
           color: red;
           font-size: 36px;
       }
   </style>
</head>

De cette façon, la couleur du texte de l'élément h1 sera définie. au rouge, avec une taille de police de 36 pixels. Il est à noter que cette méthode ne peut être utilisée que pour la page en cours et ne convient pas à plusieurs pages partageant le même style.

2. Feuille de style externe

Une feuille de style externe enregistre la feuille de style CSS dans un fichier séparé, puis référence le fichier dans le document HTML. Pour utiliser une feuille de style externe, nous devons ajouter une balise 2cdf5bf648cf2f33323966d7f58a7f3f dans la balise 93f0f5c25f18dab9d176bd4f6de5d30e et spécifier le chemin d'accès au fichier CSS dans son attribut href comme suit : 

<head>
   <link rel="stylesheet" href="styles.css">
</head>

Dans le fichier styles.css, nous peut écrire le style CSS que toutes les pages doivent utiliser, par exemple : 

h1 {
   color: red;
   font-size: 36px;
}

De cette façon, le texte de l'élément h1 dans toutes les pages qui font référence à styles.css sera défini sur rouge et la taille de la police est de 36 pixels.

3. Feuille de style en ligne

La feuille de style en ligne définit le style CSS comme attribut de l'élément. À l'aide d'une feuille de style en ligne, nous utilisons l'attribut style directement dans la balise HTML comme suit : 

<h1 style="color: red; font-size: 36px;">Hello World!</h1>

De cette façon, la couleur du texte de l'élément h1 est définie sur rouge et la taille de la police est de 36 pixels. Il convient de noter qu’une utilisation excessive des feuilles de style en ligne doit être évitée car elles sont lourdes à maintenir et ne permettent pas d’utiliser le même style CSS pour plusieurs éléments.

Résumé :

Pour les trois méthodes ci-dessus, les feuilles de style internes conviennent aux styles utilisés sur une seule page, les feuilles de style externes conviennent aux styles partagés par plusieurs pages et les feuilles de style en ligne conviennent aux paramètres de style personnalisés. Une utilisation compétente de ces méthodes peut rendre le travail de développement front-end plus efficace et standardisé.

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!

Déclaration：
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
Article précédent：Comment connecter des fichiers CSSArticle suivant：Comment connecter des fichiers CSS

Articles Liés

Voir plus