No artigo anterior em downcodes.com, mencionamos "reescrever seus arquivos CSS para torná-los mais organizados e claramente estruturados". Embora este seja um dos métodos, desenvolver bons hábitos de codificação sempre foi o que adoro no CSS. O artigo de hoje irá discutir esse conteúdo.
O último estilo CSS definido substituirá quaisquer estilos existentes ou conflitantes definidos antes dele, como no exemplo a seguir:
Exemplo de código-fonte
[www.downcodes.com] p {cor: vermelho; fundo: amarelo}
p {cor: verde}
O parágrafo acima eventualmente aparecerá em fonte verde com fundo amarelo. Isso ocorre porque a última cor definida: verde substitui o vermelho definido anteriormente. definição conflitante na definição, portanto ainda é válida.
Você realmente entende? OK, vamos fazer um pequeno teste:
Exemplo de código-fonte
[www.downcodes.com] p.vermelho {cor: vermelho}
p.verde {cor: verde}
p.azul {cor: azul}
Exemplo de código-fonte
[www.downcodes.com] <p class="red green blue">Texto de exemplo. downcodes.com</p>
<p class="green blue red">Texto de exemplo. downcodes.com</p>
<p class="azul vermelho verde">Texto de exemplo. downcodes.com</p>
Por favor, diga-me, de que cor aparecerá o texto dos três parágrafos acima quando for finalmente exibido?
A resposta é que todos eles são exibidos em azul, ou seja, azul. Embora cada parágrafo tenha três estilos p aplicados em uma ordem diferente, parece que a cor deve ser determinada de acordo com a ordem em que os estilos são aplicados. , o primeiro é exibido em azul e o terceiro é exibido em azul. O segundo é exibido em vermelho e o terceiro é exibido em verde. Na verdade, isso não tem nada a ver com o pedido. em que os estilos são aplicados, todos obedecem ao último estilo especificado e a cor é azul.
