.enviar{ width: 40%; padding:15px 0; color: white; background: orange; font-weight: bold; font-size: 18px; border: none; border-radius: 5px; transition: 1s; background; cursor: pointer; }
.enviar:hover{ background: darkorange;
}
2
respostas
respostas
Olá, por que colocamos o transition no elemento .enviar ao invés do .enviar:hover? isto dentro do CSS Obrigado
Fala Márcio!
A partir do momento em que usamos o transition no elemento com :hover, a transição de volta ao estado original do elemento sem :hover será bruta/grossa, e não uma transição mais suave.
Para uma melhor compreensão, teste o código abaixo e troque o transition do button para o button:hover para você perceber a diferença:
HTML
<button>Aperte-me!</button>CSS
button {
width: 120px;
height: 60px;
background: red;
color: white;
transition: 4s;
}
button:hover {
background: blue;
}Boa noite Samuel, executei o código, entendi o que falou, obrigado!