Cálculo de la especificidad de un selector (CSS)

StackOverflow https://stackoverflow.com/questions/1942229

Pregunta

Yo sé que para calcular la especificidad de un selector se utilizan tres números, donde el primer número de la izquierda es el número de ID, el segundo número representa el número de clases, pseudo-clases y atributos y el tercer número representa el número de elementos.

Me doy cuenta de los siguientes números son exagerados ... identificadores son más específicas que las clases y las clases son más específicos que los elementos, sino que el selector con especificidad de 1.0.0 (por lo tanto con un selector de ID) ganar más de un selector con especificidad de 0,222 0,0 (selector con 222 clases / clases seudo)?

¿Fue útil?

Solución

Sí.

Prueba: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><title></title>
<style type="text/css">
#ID {color:red}
.C1.C2.C3 ... .C220.C221.C222 {color:green}
</style>
</head>
<body>
<div id="ID" class="C1 C2 C3 ... C220 C221 C222">This is a test.</div>
</body>
</html>

El texto es de color rojo en los últimos Firefox, Chrome, IE, y Opera.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top