Maison > interface Web > tutoriel HTML > le corps du texte

Pourquoi utiliser CSS (feuilles de style en cascade)

零下一度
Libérer: 2017-06-24 11:41:36
original
2242 Les gens l'ont consulté

Aujourd'hui, je vais principalement parler des feuilles de style CSS. Utiliser le HTML en combinaison avec celui-ci peut rendre les pages HTML très colorées !

Tout d'abord, présentons brièvement pourquoi utiliser CSS(Cascading Sstyle Sheets) en cascade des feuilles de style !


 1. Parce que les feuilles de style CSS peuvent définir la façon dont les éléments HTML sont affichés

2. Tous les principaux navigateurs prennent en charge les feuilles de style CSS

3. Les feuilles de style sont extrêmement Améliore considérablement l'efficacité du travail

 4. De plus, plusieurs feuilles de style peuvent être regroupées en une seule

Si le même élément HTML est utilisé par plus de 1 Lors de la définition d'un style, quel style sera utilisé ?

De manière générale, tous les styles seront cascadés dans une nouvelle feuille de style virtuelle selon les règles suivantes, parmi lesquelles la 4ème a la priorité la plus élevée.

1. Paramètres par défaut du navigateur

2. Feuille de style externe

3. Feuille de style interne (située à l'intérieur de la balise )

4. Style en ligne (à l'intérieur de l'élément HTML)

Par conséquent , un style en ligne a la priorité la plus élevée, ce qui signifie qu'il aura priorité sur les déclarations de style suivantes : les déclarations de style dans la balise et les déclarations de style dans les feuilles de style externes. Déclaration ou déclaration de style du navigateur. (valeur par défaut) !

Voici l'introduction de sa syntaxe :

Il y a deux parties principales de la composition des règles CSS : le sélecteur et une ou plus de déclarations.

1 div{2     width:100px;3     height:100px;4 }
Copier après la connexion
Le sélecteur est généralement l'élément HTML dont vous avez besoin pour changer le style

Chaque déclaration est composée d'un attribut composé d'une valeur. !

La propriété est l'attribut de style que vous souhaitez définir. Chaque attribut a une valeur. L'attribut et la valeur sont séparés par deux points.

Ce qui suit La fonction de cette ligne de code est. pour définir la couleur du texte dans l'élément H1 comme rouge et définir la taille de la police sur 14 pixels

Dans cet exemple, .h1 est le sélecteur, et la couleur et la taille de la police sont les attributs.red et 14px sont les attributs.

h1{
    color:red;
    font-size:14px;
}
Copier après la connexion
L'image ci-dessous vous montre la structure du code ci-dessus :

Différentes méthodes d'écriture. et unités de valeurs :
En plus du mot anglais red, on peut également utiliser la valeur de couleur hexadécimale #ff0000;

p{
    color:#ff0000;
}
Copier après la connexion
On peut utilisez également les valeurs RVB de deux manières :

p{color:rgb(255,0,0);
}p{color:rgb(100%,0%,0%);
}
Copier après la connexion

N'oubliez pas d'écrire des guillemets :

Astuce : Si la valeur est composée de plusieurs mots, ajoutez des guillemets à la valeur ;

p{

 font-family: "sans serif";

}


Je serai là aujourd'hui à demain !!!

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!

Étiquettes associées:
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal