Por Héctor Villar Mozo
10. ¿De qué color sería el párrafo?
<p id="highlighted">Lorem ipsum dolor sit amet</p>
p#highlighted {
color: green;
}
p[id="hightlighted"] {
color: red;
}
Lorem ipsum dolor sit amet
Respuesta:
-
Green. Se trata de calcular la especificidad en CSS. p#hightlighted es un selector CSS que combina una tag (p) con un id (#highlighted). Su especificidad es: 001 y 100 respectivamente, dando un total de 101.
El selector p[id="hightlighted"] combina una tag (p) con un atributo ([id="highlighted"]). Su especificidad es: 001 y 010 respectivamente, dando un total de 011.
101 es mayor que 011, por lo que, en caso de empate de propiedades CSS aplicadas a un mismo elemento, se sobrepone o "gana" el de mayor especificidad.