sélecteurs CSS
sélecteurs CSS sont utilisés pour sélectionner les éléments que vous voulez à motif de style.
colonne «CSS» indique dans lequel les propriétés CSS définies (CSS1, CSS2, CSS3 ou).
| sélecteur | exemple | L'exemple montre | CSS |
|---|---|---|---|
| . classe | .intro | Sélectionnez tout le class = "intro" élément | 1 |
| # Id | #firstname | Sélectionnez tous les id = éléments "firstname" | 1 |
| * | * | Sélectionnez tous les éléments | 2 |
| élément | p | Sélectionnez tous les éléments <p> | 1 |
| élément,l'élément | div,p | Tout sélectionner l'élément <div> et l'élément <p> | 1 |
| élément | div p | Sélectionnez <div> tous les éléments <p> dans l'élément | 1 |
| element> élément | div>p | Sélectionnez tout le parent est un élément <div> de l'élément <p> | 2 |
| Élément + | div+p | Sélectionnez élément <p> suivi par tous les éléments <div> après | 2 |
| [Attribut] | [target] | Sélectionnez tous les éléments avec l'attribut cible | 2 |
| [Attribut = valeur] | [target=-blank] | Sélectionnez toute utilisation target = - élément "blanc" de | 2 |
| [Attribut ~ = valeur] | [title~=flower] | Sélectionnez tous les éléments de l'attribut title contient le mot «fleur» de | 2 |
| [Attribut | = langue] | [lang|=en] | Sélectionnez tous les éléments d'un attribut lang commencer value = "FR" de | 2 |
| : lien | a:link | Sélectionnez tous les liens non visités | 1 |
| : visited | a:visited | Sélectionnez tous les liens visités | 1 |
| : actif | a:active | Sélectionnez le lien actif | 1 |
| : hover | a:hover | Lorsque vous sélectionnez la souris sur le lien ci-dessus | 1 |
| : focus | input:focus | Sélectionnez l'élément d'entrée a le focus | 2 |
| : First-letter | p:first-letter | Sélectionnez la première lettre de chaque élément <p> | 1 |
| : First-line | p:first-line | Sélectionnez chaque <P> Le premier élément de ligne | 1 |
| : First-child | p:first-child | Spécifié uniquement lorsque <p> est le premier enfant de son style de parent. | 2 |
| : avant | p:before | Insérez le contenu avant de chaque élément <p> | 2 |
| : après | p:after | Insérez le contenu après chaque élément <p> | 2 |
| : Lang (langue) | p:lang(it) | Sélectionnez un attribut lang commencer value = "it" tous les éléments <p> | 2 |
| element1 ~ element2 | p ~ ul | Chaque élément de choix p ul après l'élément | 3 |
| [Attribut ^ = valeur] | un [src = ^ "https"] | Sélectionnez chaque valeur de l'attribut src à «https» au début de l'élément | 3 |
| [Attribut $ = valeur] | un [src = $ ". pdf"] | Sélectionnez chaque valeur de l'attribut src pour ".pdf" à la fin de l'élément | 3 |
| [Attribut * = valeur] | un [src = * "w3big"] | Sélectionnez chaque src élément valeur d'attribut contient la sous-chaîne "w3big" de | 3 |
| : First-of-Type | p: first-of-type | Sélectionner chaque élément p p est le premier élément de son parent | 3 |
| : Dernier-type | p: last-of-Type | Sélectionnez chaque élément p est le dernier élément de son parent p | 3 |
| : Seulement-of-type | p: seulement-of-type | Sélectionner chaque élément p est le seul élément de son parent p | 3 |
| : Seul enfant | p: seul enfant | Sélectionnez chaque élément p est le seul élément de son parent de l'enfant | 3 |
| : Nth-child (n) | p: nth-child (2) | Sélectionnez chaque élément p est le deuxième enfant de son parent | 3 |
| : Nth-last-child (n ) | p: nth-last-child (2) | Sélectionnez chaque élément p est le deuxième enfant de son parent, à compter du dernier enfant | 3 |
| : Nth-of-type (n ) | p: nth-of-type (2) | Sélectionner chaque élément p est le deuxième élément p de son parent | 3 |
| : Nth-last-of-type (n) | p: nth-last-of-type (2) | Sélectionner chaque élément p est le deuxième élément p de son parent, en comptant à partir du dernier enfant | 3 |
| : Last-child | p: last-child | Sélectionnez chaque élément p est le dernier enfant de son parent. | 3 |
| : root | : root | Sélectionnez l'élément racine du document | 3 |
| : vide | p: vide | Sélectionnez chacun des éléments de p n'a pas d'enfant (y compris les nœuds de texte) | 3 |
| : cible | #news: cible | Sélectionnez l'élément de #news actuellement actif (y compris le nom d'ancrage cliquable URL) | 3 |
| : activé | entrée: activé | Sélectionnez chaque élément d'entrée activé | 3 |
| : désactivé | entrée: désactivé | Sélection chaque élément d'entrée désactivé | 3 |
| : checked | entrée: coché | Sélectionnez chaque élément d'entrée sélectionné | 3 |
| : Non (sélecteur) | : Non (p) | Sélectionnez chaque élément est pas p éléments | 3 |
| :: sélection | :: Sélection | Element est sélectionné ou mis en évidence dans l'état de la correspondance partielle de l'utilisateur | 3 |
| : Out-of-range | : Out-of-range | élément d'entrée de valeur de contrepartie en dehors de la plage spécifiée | 3 |
| : In-gamme | : In-gamme | Matching élément d'entrée de valeur dans la plage spécifiée de la | 3 |
| : Lecture-écriture | : Lire-écrire | Il permet de faire correspondre l'élément lisible et inscriptible | 3 |
| : Lecture seule | : Lecture seule | Pour correspondre ensemble "readonly" (lecture seule) élément d'attribut | 3 |
| : en option | facultatif: | Pour correspondant à l'élément d'entrée en option | 3 |
| : nécessaire | : Obligation | Mettre en place pour correspondre à l'élément "nécessaire" la propriété | 3 |
| : valide | : valide | Utilisé pour correspondre à la valeur d'entrée est un élément légitime | 3 |
| : invalide | : Invalid | Valeur incorrecte pour les matches de l'élément d'entrée | 3 |