El problema de prioridad es en realidad un problema de resolución de conflictos. Cuando un selector de CSS selecciona el mismo elemento (o contenido), se deben elegir diferentes reglas de CSS según la prioridad.
La primera es la especificidad de las reglas CSS. CSS2.1 tiene un conjunto de métodos de cálculo para la especificidad, que está representado por una cadena numérica de cuatro dígitos (CSS2 es de tres dígitos, cuanto mayor sea la especificidad, más). especial la regla. En la prioridad Será más ventajoso a la hora de emitir juicios. Con respecto al cálculo específico de la especificidad, existen las siguientes reglas generales para la suma numérica en diversas situaciones:
para cada selector de ID (#someid), agregue 0,1,0,0.
Cada selector de clase (.someclass), cada selector de atributos (formado como [attr=""], etc.), cada pseudoclase (formado como: hover, etc.) agrega 0, 0, 1, 0
a cada elemento o Pseudoelementos (:firstchild), etc., agregue 0,0,0,1
. Otros selectores incluyen el selector global *, agregue 0,0,0,0. Equivale a no agregarlo, pero esto también es una especie de especificidad, que se explicará más adelante.
De acuerdo con estas reglas, las cadenas numéricas se agregan poco a poco para obtener la especificidad calculada final y luego se comparan poco a poco en orden de izquierda a derecha al comparar y elegir.
Pongamos algunos ejemplos:
h1 {color: rojo;}
/* Sólo hay un bono de elemento ordinario, el resultado es 0,0,0,1 */
cuerpo h1 {color: verde;}
/* Suma dos elementos ordinarios, el resultado es 0,0,0,2 */
--Este último gana
h2.grape {color: morado;}
/* Se agregan un elemento ordinario y un selector de clase, y el resultado es 0,0,1,1*/
h2 {color: plata;}
/*Un elemento ordinario, el resultado es 0,0,0,1 */
--El primero gana
html > body table tr[id="totals"] td ul > li {color: granate;}
/* 7 elementos ordinarios, un selector de atributos, otros dos selectores, el resultado es 0,0,1,7 */
li#answer {color: azul marino;}
/* Un selector de ID, un selector normal, el resultado es 0,1,0,1 */
--Este último gana
Además de la especificidad, hay otros
estilos dentro del texto de la regla que tienen una prioridad de 1,0,0,0, por lo que siempre son más altos que las definiciones externas. Aquí, los estilos en el texto se refieren a estilos que se parecen a