Maison  >  Article  >  interface Web  >  Quelle est l'utilité du sélecteur de classe en CSS

Quelle est l'utilité du sélecteur de classe en CSS

王林
王林original
2020-11-20 11:30:283831parcourir

Le but des sélecteurs de classe en CSS est de permettre de spécifier des styles d'une manière indépendante des éléments du document. Les sélecteurs de classe peuvent être utilisés seuls ou en combinaison avec d'autres éléments. Avant d'utiliser les sélecteurs de classe, le balisage spécifique du document doit être modifié afin que les sélecteurs de classe fonctionnent correctement.

Quelle est l'utilité du sélecteur de classe en CSS

Le rôle du sélecteur de classe CSS : permet de spécifier des styles de manière indépendante des éléments du document.

Ce sélecteur peut être utilisé seul ou en combinaison avec d'autres éléments.

(Partage vidéo d'apprentissage : tutoriel vidéo CSS)

Remarque : Ces sélecteurs ne peuvent être utilisés qu'après que le document a été marqué de manière appropriée, donc l'utilisation de ces deux sélecteurs est généralement Cela demande d’abord un peu de réflexion et de planification.

Pour appliquer des styles quel que soit l'élément de conception spécifique, la méthode la plus courante consiste à utiliser un sélecteur de classe.

Exemple :

Modifier le code HTML

Avant d'utiliser le sélecteur de classe, vous devez modifier le balisage spécifique du document afin que le sélecteur de classe puisse fonctionner correctement.

Afin d'associer le style d'un sélecteur de classe à un élément, la classe doit être spécifiée comme valeur appropriée. Jetez un œil au code HTML suivant :

<h1 class="important">
This heading is very important.
</h1>

<p class="important">
This paragraph is very important.
</p>

Dans le code ci-dessus, la classe de deux éléments est spécifiée comme importante : le premier titre (élément h1) et le deuxième paragraphe (élément p).

Syntaxe :

On utilise ensuite la syntaxe suivante pour appliquer des styles à ces éléments classés, soit un point (.) avant le nom de la classe, combiné à un sélecteur de caractère générique :

*.important {color:red;}

Si vous souhaitez uniquement sélectionner tous les éléments portant le même nom de classe, vous pouvez ignorer le sélecteur de caractère générique dans le sélecteur de classe sans aucun effet indésirable :

.important {color:red;}

Recommandations associées : Tutoriel 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