Solucionado (ver solução)
Solucionado
(ver solução)
4
respostas

Dúvida no seletor .lista__link a (Footer)

Olá.

Gostaria de saber porque na hora de selecionar os itens da lista localizados no footer, tenho que especificar no CSS com a âncora "a".

.lista__link a{
   text-decoration: none;
   color: var(--branco-principal);
   margin-left: 1em;
}

Se eu coloco sem a âncora, ele não aceita os comandos e o resultado fica diferente.

.lista__link {
   text-decoration: none;
   color: var(--branco-principal);
   margin-left: 1em;
} 

Resultado sem a âncora.Resultado com a âncora.

Poderiam me explicar o por que disso?

Obrigado.

4 respostas

Ao utilizar .lista__link a, você está selecionando elementos <a> que estão dentro de elementos com a classe .lista__link. Isso significa que você está especificando estilos para os links dentro do elemento com a classe .lista__link. Por outro lado, ao usar .lista__link sem a âncora (a), você está selecionando diretamente os elementos com a classe .lista__link. Nesse caso, os estilos serão aplicados ao próprio elemento com essa classe, não aos links dentro dele. Se o HTML da sua lista tiver a estrutura como:

<div class="lista__link">
   <a href="#">Link 1</a>
   <a href="#">Link 2</a>
   <!-- ... outros links ... -->
</div>

Então, ao usar .lista__link a, você está estilizando os links dentro do contêiner .lista__link. Se você usar apenas .lista__link, estará estilizando diretamente o contêiner, e isso pode não afetar os links da maneira desejada. Verifique a estrutura HTML da sua lista para garantir que você esteja aplicando os estilos da maneira mais apropriada para a sua situação.

Entendi. Faz sentido mesmo.

Obrigado pela explicação.

ótimo, tive a mesma duvida

solução!

Fico contente por ter contribuído para esclarecer a sua dúvida. Estou à disposição para qualquer outra questão!

Um abraço,

Se este post foi útil, por favor, considere marcá-lo como solucionado ✓. Desejo a você excelentes estudos!