Quelles sont les syntaxes des sélecteurs en CSS3

Aujourd'hui, je vais vous présenter la syntaxe de sélection couramment utilisée en CSS3. La syntaxe est généralement divisée en trois types, la syntaxe du sélecteur de base, la syntaxe du sélecteur hiérarchique et le sélecteur de pseudo-classe dynamique Grammaire. Laissez-moi vous donner une explication détaillée ci-dessous.

1. Syntaxe de base du sélecteur

(1)* Sélecteur générique Sélectionne tous les éléments HTML du document

(2)E

Sélecteur d'élément Sélectionnez le type spécifié d'élément HTML

#id Sélecteur d'ID Sélectionnez n'importe quel type d'élément avec la valeur d'attribut d'ID spécifiée comme "id"

.class Sélecteur de classe Sélectionnez la valeur d'attribut de classe spécifiée comme "class" Tout élément multiple de n'importe quel type

selector1,selectorN Sélecteur de groupe Fusionne l'ensemble des éléments correspondant à chaque sélecteur

2, syntaxe du sélecteur hiérarchique

(1)E F

Sélecteur descendant (y compris le sélecteur) Sélectionne l'élément F correspondant, et l'élément F correspondant est inclus dans l'élément E correspondant

(2)E>F enfant Le sélecteur sélectionne l'élément F correspondant, et le élément enfant de l'élément E correspondant à l'élément F correspondant

(3)E+F

Le sélecteur frère adjacent sélectionne l'élément F correspondant, Et l'élément F correspondant est fermement serré dans le dos de l'élément E correspondant

(4) E ~ F

Sélecteur général Sélectionnez l'élément F correspondant, et toute la correspondance après l'élément E correspondant L'élément F

3 , syntaxe du sélecteur de pseudo-classe dynamique

(1)E:link Le sélecteur de pseudo-classe de lien sélectionne l'élément E correspondant, et l'élément correspondant est défini et le lien hypertexte n'est pas visité. Couramment utilisé sur les points de description de lien

(2) Le sélecteur de pseudo-classe E:visited Link sélectionne les éléments E correspondants, et les éléments correspondants sont définis avec des hyperliens et ont été visités. Couramment utilisé sur les points de dessin de liens

(3)E:active Le sélecteur de comportement utilisateur sélectionne l'élément E correspondant et l'élément correspondant est activé. Couramment utilisé sur les points et les boutons de dessin de liens

(4)E:hover Sélecteur de comportement de l'utilisateur Sélectionne l'élément E correspondant et la souris de l'utilisateur reste sur l'élément E. Les navigateurs IE6 et inférieurs ne prennent en charge que a:hover

(5)E:focus Le sélecteur de comportement utilisateur sélectionne l'élément E correspondant, et l'élément correspondant obtient le focus

Je pense que vous maîtrisez la méthode après avoir lu l'introduction ci-dessus. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture connexe :

Comment créer des effets de particules de feux d'artifice avec H5

Tutoriel pour rendre la largeur de div adaptative

Expérience de développement à l'aide de balises h dans des pages Web

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!