Curso curto en CSS
A fervenza é o que fai que as follas de estilo CSS sexan tan útiles. En definitiva, a fervenza define o orden de precedencia de como se deben aplicar os estilos en conflito. Noutras palabras, se tes dous estilos:
p {cor: vermello; }
p {cor: azul; }
A fervenza determina a cor dos parágrafos, aínda que a folla de estilo indica que deberían ser tanto de cor vermella como de azul. Ao final só se pode aplicar unha cor aos parágrafos, polo que hai que facer unha orde.
E esta orde aplícase mediante a cal os selectores (o p no exemplo anterior) teñen a maior prevalencia e que orde aparecen no documento.
A seguinte lista é unha simplificación de como o seu navegador decide a preferencia dun estilo:
- Mire na folla de estilo dun selector que coincida co elemento. Se non hai estilos definidos, usa as regras predeterminadas no navegador
- Mire na folla de estilo para os selectores marcados. Importante e aplique os para os elementos axeitados.
- Todos os estilos da folla de estilo substituirán os estilos predeterminados do navegador (excepto no caso das follas de estilo do usuario).
- Canto máis específico sexa o selector de estilo, maior será o precedente que terá. Por exemplo, div> p.class é máis específico que p.clase que é máis específico que p.
- Finalmente, se dúas regras se aplican ao mesmo elemento e teñen a mesma preferencia do selector, aplicaranse o que se cargue por última vez. Noutras palabras, a folla de estilo léase de arriba abaixo e os estilos son aplicados un sobre o outro.
Con base nesas regras, no exemplo anterior, os parágrafos estarían escritos en azul, porque p {cor: azul; } chega o último na folla de estilo.
Esta é unha explicación moi simplificada da fervenza. Se estás interesado en aprender máis sobre como traballa a fervenza, debes ler O que significa "Cascade" en Cascading Style Sheets? .