Fala Fabio!
Tudo tranquilo?
Os elementos blockquote
irão receber as duas configurações:
blockquote {
background-color: #D9E5E3;
border: 10px solid #C2CCCA;
width: 250px;
box-sizing: border-box;
}
...
blockquote, aside, footer {
padding: 20px;
}
Por que no segundo bloco ele está dizendo para o navegador: "Todos os elementos blockquote
, aside
e footer
recebem padding: 20px
", e no primeiro bloco está dizendo: "Apenas os blockquote
irão receber as configurações".
Só precisa tomar cuidado quando você faz uma atribuição de propriedade em algum lugar do seu CSS e em outro você altera esse valor, por exemplo se fosse assim:
blockquote {
background-color: #D9E5E3;
border: 10px solid #C2CCCA;
width: 250px;
box-sizing: border-box;
color: green;
}
...
blockquote, aside, footer {
padding: 20px;
color: black;
}
Se você tiver um código HTML assim:
<blockquote>Olá!</blockquote>
Qual será a cor do texto? Verde ou Preta?
Neste caso será Preta, pois o CSS lê em formato cascata, ou seja, o que vem depois é considerado mais relevante, se o código CSS fosse invertido:
blockquote, aside, footer {
padding: 20px;
color: black;
}
...
blockquote {
background-color: #D9E5E3;
border: 10px solid #C2CCCA;
width: 250px;
box-sizing: border-box;
color: green;
}
A cor seria Verde!
Espero ter ajudado!
Abraços!