Solucionado
No exercício do blog, além do "main", cada tag "article" tem um um descendente "footer". Como o estilo do "footer" principal é diferente, a regra CSS aplica estilo a todos os "footer". Como posso selecionar apenas o "footer" que é descendente direto do "main"? Sem precisar usar um atributo "id"?
Olá Júlio! O footer não é descendente do main. Ele não está dentro do main, mas fora dele. Essa é a estrutura que a página deve ter:
<body>
<main>
// conteúdo do main
</main>
<img>
<aside>
// conteudo do aside
</aside>
<footer>
// conteudo do footer
</footer>
</body>Você pode fazer essa estilização de duas formas. Pode atribuir um estilo para todas as tag footer e depois atribuir outro estilo para as tags footer do blog. Assim:
.footer {
// estilo para todas as tag footer
}
.article footer {
// estilo para as tags footer dentro de uma tag article
}Ou, o que é mais recomendado, utilizar classes (prefira sempre as classes e não o id). Aí você pode criar uma classe para o footer da página ou criar uma classe para os footers dos articles. Abaixo criei uma para o footer da página:
// HTML
<footer class="rodape-pagina">
// conteúdo do footer da página
</footer>
// CSS
.rodape-pagina {
background-color: #000;
}Dessa forma, os footers dos articles ficam com a formatação padrão e o footer da página é estilizado atraves da classe rodape-pagina.
O ideal é sempre utilizar classes! Utilizando da primeira maneira também funciona neste caso, mas e se sua página crescer e você tiver outro footer dentro de outro article e quiser um estilo diferente? Vai dar trabalho arrumar tudo isso!
Não se intimide no uso das classes, elas facilitam e muito o trabalho de desenvolvimento e reaproveitamento de código.
Abraços e sucesso nos estudos!