Maison >interface Web >tutoriel CSS >Que sont les sélecteurs CSS ? Quels types de sélecteurs CSS existe-t-il ?

Que sont les sélecteurs CSS ? Quels types de sélecteurs CSS existe-t-il ?

云罗郡主
云罗郡主original
2018-11-03 14:44:315951parcourir

Dans les styles CSS, ils sont généralement composés de trois parties, des sélecteurs, des attributs et des valeurs d'attribut. Cependant, de nombreux novices CSS ne sont pas très familiers avec les sélecteurs CSS. Quels types de sélecteurs CSS existe-t-il ? [Lecture recommandée : Résumé de l'utilisation de 30 sélecteurs CSS3]

Regardons d'abord un morceau de code :

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>什么叫CSS选择器?</title>
</head>
<body>
    <div>php1</div>
    <div>php2</div>
    <div>php3</div>
</body>
</html>

Le L'effet est le suivant :

Que sont les sélecteurs CSS ? Quels types de sélecteurs CSS existe-t-il ?

Et si nous voulons définir php2 en bleu ? Nous devons utiliser un moyen pour "sélectionner" le deuxième div, puis changer la couleur de son attribut CSS en bleu. Comme ceci, modifiez un certain élément pour obtenir l'effet souhaité et sélectionnez l'étiquette souhaitée. La méthode est ce qu'on appelle. "sélecteur", ce qui signifie que le sélecteur est un moyen de sélectionner des éléments.

Le soi-disant sélecteur, pour parler franchement, consiste à utiliser une méthode pour sélectionner le tag que vous souhaitez ! Ce n'est qu'après l'avoir sélectionné que vous pourrez utiliser le style CSS de cette balise. C'est assez simple. CSS propose de nombreuses façons de sélectionner les balises dont vous avez besoin, et ces différentes manières sont des sélecteurs différents.

2 : Quels types de sélecteurs CSS existe-t-il ?

1. Sélecteur de balises (tels que : body, div, p, ul, li)

2. ( Tel que : class="head", class="head_logo")

3. Sélecteur d'ID (tel que : id="name", id="name_txt")

4. Sélecteur de sélection globale (tel que : *)

5. Sélecteur de combinaison (tel que : .head .head_logo, notez que les deux sélecteurs sont séparés par la barre d'espace)

6. (comme : div p , notez que les deux sélecteurs sont séparés par la barre d'espace)

7. Sélecteur de pseudo-classe (par exemple : style de lien, pseudo-classe d'un élément, 4 états différents : lien , visité, actif, survol.)

8. Sélecteurs d'attributs pour la correspondance de chaînes (^ $ * trois types, correspondant respectivement au début, à la fin et à l'inclusion)

Ce qui précède est la réponse à quoi sert un sélecteur CSS ? Une introduction complète aux types de sélecteurs CSS. Si vous souhaitez en savoir plus sur le Tutoriel CSS3, suivez le site Web php chinois.


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