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

Boão de next e prev

O css para mudar a cor do boao do slider é

.slick-prev:before, .slick-next:before{
    color: black;
}

Porém, isso não funcionou. Eu mudei para:

.slick-prev.slick-arrow:before, .slick-next.slick-arrow:before{
    color: black;
}

Pois o botao possuia as duas classes .slick-prev e .slick-arrow e funcionou..

Gostaria de saber o porquê desse comportamento. Além disso, porque eu não posso mudar a cor do botão usando apenas uma das classes do botão citadas aneriormene, mas tenho que o usar a pseudo classe :before?

2 respostas
solução!

A questão de não ter funcionado apenas com uma classe é a seguinte. As duas regras estao no mesmo nivel, ou seja, ao duas se expecificam ao elementos da mesma maneira... uma classe. Não funcionou pelo fato de quando há este conflito ganha quem veio por ultimo e assim conta a ordem em que voce incluiu os arquivos em seu html.

No caso do ::before. É muito comum o uso dele em lugares de componentes que precisam de algo a mais. Por exemplo todo layout de carrossel tem seta. Ou todo layout de balao de fala (como no whatsapp) tem aquela pontinha apontando para quem enviou a mensagem. Assim com uma classe no css e um componente no html já se faz sufiente para montar o layout.

Obrigao pela resposta. De fato, o que você falou esta correto. Eu ja estava pesquisando sobre precedĉncia de seletores css.

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software