Tous les sélecteurs

Sélecteurs simples
`*`	tous les éléments du document HTML (sélecteur universel)
`nom_elt`	tous les éléments `nom_elt` du document HTML (sélecteur de type)
`.abcd`	tous les éléments dont l'attribut `class` a la valeur `abcd` (sélecteur de classe)
`#xyz`	l'élement dont l'attribut `id` a la valeur `xyz` (sélecteur d'identifiant)

Sélecteurs d'attribut
`[att]`	élements avec un attribut `att`, quelque soit la valeur de cet attribut.
`[att="val"]`	éléments avec un attribut `att` dont la valeur est égale à `val`.
`[att^="val"]`	éléments avec un attribut `att` dont la valeur commence par `val`.
`[att$="val"]`	éléments avec un attribut `att` dont la valeur finit par `val`.
`[att*="val"]`	éléments avec un attribut `att` dont la valeur contient `val`.
`[att~="val"]`	éléments avec un attribut `att` dont la valeur est une liste de valeurs séparées par un espace, et dont l'une de ces valeur est égale à `val`.
`[att\|="val"]`	éléments avec un attribut `att` dont la valeur est une liste de valeurs séparées par une virgule, et dont l'une de ces valeurs est égale à `val`.

Pseudo classe
`:link`	élements `a` (liens) qui n'ont pas encore été visités.
`:visited`	élements `a` (liens) qui ont déjà été visités.
`:active`	éléments quand la souris est enfoncée.
`:hover`	éléments survolés par la souris.
`:focus`	éléments qui ont deviennent la cible des interactions clavier ou souris(focus).
`:root`	racine du document, soit l'élément `html`
`:first-child`	1er enfant
`:nth-child(n)`	n-ième enfant
`:last-child`	dernier enfant
`:nth-last-child(n)`	n-ième enfant en partant de la fin
`:only-child`	éléments qui sont les seuls enfants de leur parent.
`:first-of-type`	1er enfant d'un certain type
`:nth-of-type(n)`	n-ième enfant d'un certain type
`:last-of-type`	dernier enfant d'un certain type
`:nth-last-of-type(n)`	n-ième enfant d'un certain type, en partant de la fin
`:only-of-type`	éléments qui sont les seuls enfants d'un certain type
`:empty`	éléments qui n'ont pas d'enfant, y compris de noeud texte.
`:target`	éléments qui sont les cibles d'une ancre nommée dans des liens.
`:enabled`	zones de formulaire actives (ie avec saisie ou click possible).
`:disabled`	zones de formulaire désactivés (ie sans saisie ou click possible).
`:checked`	case à cocher ou bouton radio cochés.
`:not(S)`	éléments qui ne seraient pas sélectionnés par le sélecteur simple `S`

Pseudo éléments
`::first-line`	1ère ligne du texte d'un élément
`::first-letter`	1ère lettre du texte d'un élément
`::before`	insére un contenu avant un élément
`::after`	insére un contenu après un élément

Sélecteurs composés
Les sélecteurs composés (aussi appelés sélecteurs contextuels) sont faits de plusieurs sélecteurs simples séparés par un combinateur. On peut faire le parallèle avec une opération mathématique, composées de plusieurs membres (les sélecteurs) reliés par des opérateurs (les combinateurs). Ici on ne fera pas d'opération sur des nombres, mais des combinaisons sur les éléments dans le DOM en fonction de leur place les uns par rapport aux autres dans la hiérarchie (enfants, parents, descendants, frères). syntaxe des sélecteurs composés La lecture des sélecteurs composés se fait de droite à gauche et les déclarations de style portent sur le sélecteur le plus à droite. La figure précédente se lit : je cherche les éléments `p` qui sont enfants directs d'éléments `div` précédés d'éléments `h3`.
	`S1` et `S2` représentent chacun un sélecteur simple, d'attribut, de pseudo classe ou de pseudo élément
`S1, S2`	sélecteurs groupés : `S1` et `S2`.
`S1 S2`	sélecteur de descendants : les éléments `S2` qui sont descendants de `S1`.
`S1 > S2`	sélecteur d'enfants : les éléments `S2` qui sont des enfants de `S1`.
`S1 + S2`	sélecteur d'adjacents direct : S1 et S2 ont le même parent, et les éléments `S2` sont immédiatement précédés d'un élément `S1`.
`S1 ~ S2`	sélecteur d'adjacents indirect : S1 et S2 ont le même parent, et les éléments `S2` sont précédés quelque part d'un élément `S1`.