Minha dúvida é bem objetiva.
Tratando-se de seletores css.
Tenho o seguinte código HTML
e CSS
:
#element p{color:blue;}
.element p{color:red;}
div p{color:pink;}
div.element p{color:yellow;}
div[name="element"] p{color:purple;}
div p:first-child{color:brown;}
div p:nth-child(1){color:white;}
<div class="element" id="element" name="element">
<p>Elemento</p>
</div>
Sei que já há uma pergunta relacionada, mas nesse caso estou tratando com uma série de seletores, e não somente classe
e id
.
Porque é aplicado o estilo do seletor id
?
Porque o id
tem prioridade em cima dos outros tantos seletores, já que os demais vem depois dele ?
Na última linha de estilo eu tenho um caminho com 3 seletores e mesmo assim o id
tem prioridade, porquê ?