« Le langage CSS/Structure et syntaxe » : différence entre les versions
Contenu supprimé Contenu ajouté
→Ordre des spécificités des règles : + précision sur le calcul de priorité, - erreur classique sur !important dans IE (cf page de discussion) |
|||
Ligne 232 :
Il est évident dans l'exemple précédent que les titres du menu ne doivent pas être traités comme les autres titres. Aussi, plus le sélecteur d'élément est en quelque sorte ''précis'' dans sa cible, plus sa priorité est importante. La précision du sélecteur est appelé ''spécificité'' dans le jargon CSS. L'ordre des spécificités est le suivant, de la moins prioritaire à la plus prioritaire :
# élément Html, par exemple « <tt>h1 {color: black}</tt> » (vaut 1 point de priorité).
# imbrication d'éléments, par exemple « <tt>div h1 {color: black}</tt> » (vaut 2 points de priorité, un par élément présent dans le sélecteur)
# utilisation d'une classe, par exemple « <tt>h1.noir {color: black}</tt> » (vaut 11 points de priorité: 1 pour l'élément, 10 pour la classe)
# utilisation d'un identifiant, par exemple « <tt>h1#nom-du-site {color: black}</tt> » (vaut 101 points de priorité: 1 pour l'élément, 100 pour l'identifiant)
# style dans la balise Html, par exemple « <tt><nowiki><h1 style="color: black">...</h1></nowiki></tt> » (vaut 1000 points de priorité)
Un style
p {
color: gray !important;
}
==== Calcul de spécificité ====
| |||