Comment référencer CSS-Questions et réponses frontales-php.cn

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 dans la balise et y écrire le code CSS comme suit :

h1 { color: red; font-size: 36px; } Copier après la connexion 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 dans la balise et spécifier le chemin d'accès au fichier CSS dans son attribut href comme suit :

Copier après la connexion 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; } Copier après la connexion 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 :

Hello World! Copier après la connexion 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é.