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

Dúvida sobre o bloco de declarações

Olá, pessoal.

O exercício pede assim: "Qual linha devemos adicionar ao primeiro bloco de declarações (.botao) para que, quando o mouse seja passado sobre um elemento com essa classe, a sombra apareça em 1 segundo e o fundo mude de verde para vermelho em 2 segundos? "

A resposta está abaixo e os blocos estão mais abaixo.

A minha dúvida é: a declaração de "transition" não deveria ser colocada no bloco "botao:hover" ?

transition: box-shadow 1s, background-color 2s;
.botao {
    background-color: green;
}

.botao:hover {
    background-color: red;
    box-shadow: 0 0 3px white;
}
2 respostas
solução!

Boa tarde, Benício!

A propriedade transition fica dentro do seletor .botao mesmo. Isso acontece porque você está dizendo que esse elemento vai fazer uma transição específica quando aquelas propriedades (background-color, por exemplo) mudarem, independente de como elas mudem e de quem faça essa mudança.

Então adicionamos no elemento, e toda alteração na propriedade será feita com uma transição.

Espero ter ajudado, abraços!

Valeu, Juliana! :)