" et " ; " Entre les paires de balises ; 3. Styles externes, écrivez le code de style dans un fichier ".css" séparé."/> " et " ; " Entre les paires de balises ; 3. Styles externes, écrivez le code de style dans un fichier ".css" séparé.">

Maison  >  Article  >  interface Web  >  CSS divise les styles de superposition en trois types

CSS divise les styles de superposition en trois types

青灯夜游
青灯夜游original
2021-12-09 16:14:292930parcourir

Trois types de styles de superposition CSS : 1. Style en ligne, écrivez le code de style dans l'attribut style de la balise HTML ; 2. Style en ligne, écrivez le code de style dans la page "c9ccee2e6ea535a969eb3f532ad9fe89" et "12240472c1a031312f6afcf9cb348f87" paire de balises ; 3. Style externe, écrivez le code de style dans un fichier ".css" séparé.

CSS divise les styles de superposition en trois types

L'environnement d'exploitation de ce tutoriel : système Windows7, version CSS3&&HTML5, ordinateur Dell G3.

Afin d'enrichir les styles des éléments des pages Web et de séparer le contenu et le style des pages Web, CSS est né de cette idée. CSS est l'abréviation de Cascading Style Sheets, qui signifie feuilles de style en cascade. Avec CSS, la plupart des balises qui expriment les styles en HTML ne sont plus nécessaires. HTML est uniquement responsable de la structure et du contenu du document, et la présentation est entièrement laissée au CSS, ce qui rend les documents HTML plus concis.

CSS est principalement utilisé pour concevoir le style des pages Web et embellir les pages Web ; il peut non seulement modifier les pages Web de manière statique, mais également formater dynamiquement divers éléments des pages Web en conjonction avec divers langages de script.

CSS peut effectuer un contrôle précis au niveau des pixels sur la disposition des positions des éléments dans les pages Web, prend en charge presque toutes les tailles et styles de police et a la capacité de modifier les objets de page Web et les styles de modèle.

Les styles CSS comprennent principalement trois types : les styles en ligne (styles en ligne), les styles internes (styles en ligne) et les styles externes (styles externes).

1. Style en ligne :

à l'intérieur de la structure, c'est-à-dire le style écrit à l'intérieur de la balise, dans la partie de début de la balise, dans l'attribut style.

Exemple :

<标记 style="样式的属性名1:样式的属性值1;属性名2:属性值2;......"></标记>

2. Style interne (style intégré) :

est écrit à l'intérieur de la page HTML, stocké dans la balise head, et le style est écrit dans la balise style.

Exemple :

<style>
选择器 {属性名:属性值;属性名:属性值;......}
</style>

3. Style externe (style externe) :

Le style externe consiste à mettre tous les styles dans un ou plusieurs fichiers de feuille de style externe avec l'extension .css. Un document de feuille de style CSS représente une feuille de style externe.

Les feuilles de style externes doivent être importées dans les documents Web avant de pouvoir être reconnues et analysées par le navigateur. Les fichiers de feuilles de style externes peuvent être importés dans des documents HTML de deux manières.

1) Utilisez la balise 2cdf5bf648cf2f33323966d7f58a7f3f pour importer

Utilisez la balise 2cdf5bf648cf2f33323966d7f58a7f3f pour importer le fichier de feuille de style externe :

<link href="css文件路径" rel="stylesheet" type="text/css" />

Explication de chaque attribut :

  • l'attribut href définit l'adresse de l'attribut externe. fichier de feuille de style, vous pouvez C'est une adresse relative ou une adresse absolue. L'attribut

  • rel définit le document associé, c'est-à-dire ici la feuille de style associée. L'attribut

  • type définit le type de fichier importé. Comme l'élément style, text/css indique un fichier texte CSS.

2) Utilisez le mot-clé @import pour importer

Utilisez le mot-clé @import dans la balise c9ccee2e6ea535a969eb3f532ad9fe89 pour importer le fichier de feuille de style externe :

<style type="text/css">
@import url("css文件路径");
</style>

Après le mot-clé @import, utilisez la fonction url() pour inclure l'adresse spécifique du fichier de feuille de style externe.

(Partage de vidéos d'apprentissage : Tutoriel vidéo CSS)

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