Nombre de sélecteurs de classes, d'attributs et de pseudo-classes
Nombre de sélecteurs de types et de pseudo-éléments
body {
/*
* 1 sélecteur de type => 0 - 0 - 1
*/
}
.abstract {
/*
* 1 sélecteur de classe => 0 - 1 - 0
*/
}
#article {
/*
* 1 sélecteur d'ID => 1 - 0 - 0
*/
}
body .abstract {
/*
* 1 sélecteur de type + 1 sélecteur de classe => 0 - 1 - 1
*/
}
body #article .abstract {
/*
* 1 sélecteur de type + 1 sélecteur d'ID + 1 sélecteur de classe => 1 - 1 - 1
*/
}
Cascade
En cas de conflit entre deux règles CSS qui appliquent la même propriété avec des valeurs différentes :
L'ordre des classes dans l'attribut class n'a pas d'importance
Pour deux règles qui ont la même spécificité, l'ordre dans lequel les règles CSS figurent dans un fichier CSS ont une important : celle qui arrive en dernière gagne en cas de conflit
Pour deux règles qui n'ont pas la même spécificité, celle qui a la plus grande spécificité gagne, peu importe l'ordre dans lesquelles elles apparaissent dans le fichier CSS