référence CSS w3ii 'est testé régulièrement avec tous les principaux navigateurs.
CSS Selectors
En CSS, les sélecteurs sont des modèles utilisés pour sélectionner l' element(s) que vous voulez style.
Le "CSS" colonne indique dans quelle version CSS la propriété est définie (CSS1, CSS2, or CSS3) .
| Sélecteur | Exemple | Exemple Description | CSS |
|---|---|---|---|
| . class | .intro | Sélectionne tous les éléments avec class="intro" | 1 |
| # id | #firstname | Sélectionne l'élément avec id="firstname" | 1 |
| * | * | Sélectionne tous les éléments | 2 |
| element | p | Sélectionne tous les <p> éléments | 1 |
| element,element | div, p | Sélectionne tous les <div> éléments et tous les <p> éléments | 1 |
| element element | div p | Sélectionne tous les <p> éléments à l' intérieur <div> éléments | 1 |
| element > element | div > p | Sélectionne tous les <p> éléments dont le parent est un <div> élément | 2 |
| element + element | div + p | Sélectionne tous les <p> éléments qui sont placés immédiatement après <div> éléments | 2 |
| element1 ~ element2 | p ~ ul | Sélectionne tous les <ul> élément qui sont précédés par un <p> élément | 3 |
| [ attribute ] | [target] | Sélectionne tous les éléments avec un attribut cible | 2 |
| [ attribute = value ] | [target=_blank] | Sélectionne tous les éléments avec target="_blank" | 2 |
| [ attribute ~= value ] | [title~=flower] | Sélectionne tous les éléments avec un attribut title contenant le mot "flower" | 2 |
| [ attribute |= value ] | [lang|=en] | Sélectionne tous les éléments avec une valeur d'attribut lang commençant par "en" | 2 |
| [ attribute ^= value ] | a[href^="https"] | Sélectionne tous les <a> élément dont href valeur d'attribut commence par "https" | 3 |
| [ attribute $= value ] | a[href$=".pdf"] | Sélectionne tous les <a> élément dont la valeur de l' attribut href se termine par ".pdf" | 3 |
| [ attribute *= value ] | a[href*="w3ii"] | Sélectionne tous les <a> élément dont href valeur d'attribut contient la sous - chaîne "w3ii" | 3 |
| :active | a:active | Sélectionne le lien actif | 1 |
| ::after | p::after | Insérez quelque chose après le contenu de chaque <p> élément | 2 |
| ::before | p::before | Insérez quelque chose avant que le contenu de chaque <p> élément | 2 |
| :checked | input:checked | Sélectionne tous les vérifier <input> élément | 3 |
| :disabled | input:disabled | Sélectionne toutes les personnes handicapées <input> élément | 3 |
| :empty | p:empty | Sélectionne tous les <p> élément qui n'a pas d' enfants (including text nodes) les (including text nodes) | 3 |
| :enabled | input:enabled | Sélectionne tous les permis <input> élément | 3 |
| :first-child | p:first-child | Sélectionne tous les <p> élément qui est le premier enfant de son parent | 2 |
| ::first-letter | p::first-letter | Sélectionne la première lettre de chaque <p> élément | 1 |
| ::first-line | p::first-line | Sélectionne la première ligne de chaque <p> élément | 1 |
| :first-of-type | p:first-of-type | Sélectionne tous les <p> élément qui est le premier <p> élément de son parent | 3 |
| :focus | input:focus | Sélectionne l'élément d'entrée qui a le focus | 2 |
| :hover | a:hover | Sélectionne les liens de la souris | 1 |
| :in-range | input:in-range | Sélectionne des éléments d'entrée d'une valeur dans une plage spécifiée | 3 |
| :invalid | input:invalid | Sélectionne tous les éléments d'entrée avec une valeur non valide | 3 |
| :lang( language ) | p:lang(it) | Sélectionne tous les <p> élément avec un lang attribut égal à "it" (Italian) | 2 |
| :last-child | p:last-child | Sélectionne tous les <p> élément qui est le dernier enfant de son parent | 3 |
| :last-of-type | p:last-of-type | Sélectionne tous les <p> élément qui est le dernier <p> élément de son parent | 3 |
| :link | a:link | Sélectionne tous les liens non visités | 1 |
| :not( selector ) | :not(p) | Sélectionne tous les éléments qui ne sont pas un <p> élément | 3 |
| :nth-child( n ) | p:nth-child(2) | Sélectionne tous les <p> élément qui est le deuxième enfant de son parent | 3 |
| :nth-last-child( n ) | p:nth-last-child(2) | Sélectionne tous les <p> élément qui est le deuxième enfant de son parent, à compter du dernier enfant | 3 |
| :nth-last-of-type( n ) | p:nth-last-of-type(2) | Sélectionne tous les <p> élément qui est le second <p> élément de son parent, à compter du dernier enfant | 3 |
| :nth-of-type( n ) | p:nth-of-type(2) | Sélectionne tous les <p> élément qui est le second <p> élément de son parent | 3 |
| :only-of-type | p:only-of-type | Sélectionne tous les <p> élément qui est le seul <p> élément de son parent | 3 |
| :only-child | p:only-child | Sélectionne tous les <p> élément qui est le seul enfant de son parent | 3 |
| :optional | input:optional | Sélectionne des éléments d'entrée sans "required" attribut | 3 |
| :out-of-range | input:out-of-range | Sélectionne des éléments d'entrée avec une valeur en dehors d'une plage spécifiée | 3 |
| :read-only | input:read-only | Sélectionne des éléments d'entrée avec le "readonly" attribut spécifié | 3 |
| :read-write | input:read-write | Sélectionne des éléments d'entrée avec le "readonly" attribut non spécifiée | 3 |
| :required | input:required | Sélectionne des éléments d'entrée avec le "required" attribut spécifié | 3 |
| :root | :root | Sélectionne l'élément racine du document | 3 |
| ::selection | ::selection | Sélectionne la partie d'un élément qui est sélectionné par un utilisateur, | |
| :target | #news:target | Sélectionne l'élément de #news actif courant (cliqué sur une URL contenant ce nom d'ancrage) | 3 |
| :valid | input:valid | Sélectionne tous les éléments d'entrée avec une valeur valide | 3 |
| :visited | a:visited | Sélectionne tous les liens visités | 1 |