Syntaxe S1
S2
div p {
margin-bottom: 0;
font-family: verdana;
}
Le combinateur espace permet de sélectionner les
éléments descendants d'un autre élément.
La sélection s'effectue donc quelque soit le niveau d'imbrication
des éléments.
L'élément ancêtre est le premier sélecteur et ses descendants sont obtenus par le deuxième sélecteur.
div p { ... }
se lit : je cherche tous les éléments p qui ont
pour ancêtre un élément div
Les sélecteurs utilisés dans la règle peuvent être de n'importe quel type ( simples, d'attributs, des pseudo classes, des pseudo éléments).
p.important a[href^="http"] { ... } se lit :
je cherche tous les éléments a dont
l'attribut href commence par http et qui
sont les descendants d'éléments p avec la
classe important.
L'exemple suivant entoure d'une bordure les éléments li qui sont les descendant d'éléments ol. On remarquera que la sélection se fait sur toute la profondeur de l'arbre DOM et qu'elle inclut des enfants et des arrières-petits-enfants.