-4

body button{
    background-color: #f80032;
    color: white;
    border: none;
    width: 200px;
    height: 100px;
    font-size: 40px;
    border-radius: 30px;

    transition-property: scale;
    transition-duration: 0.4s;
    transition-timing-function: ease-in-out;
}

body button:hover{
    transform: scale(1.1);
    width: 250;
    height: 150;
    cursor: pointer;
}
        <div class="buy">
            <button>
                Comprar
            </button>
        </div>

1 Resposta 1

-3
  <style>
   h1{
     width: 90px;
     height: 40px;
     background: pink;
     border: 1px solid black;
   }
    h1:hover{
      width: 300px;
      height: 300px;
      background: linear-gradient(to left, purple, pink);
      transition: background 10s;
      transition: width 7s;
      transition: height 7s;
    }
  </style>
</head>

<body>
  <h1>
    Título
  </h1>
</body>

ESSE É UM EXEMPLO DE TRANSIÇÃO. MAS BASICAMENTE VOCẼ DEVE USAR A TAG HOVER.

1
  • Sua resposta pode ser melhorada adicionando informações fundamentais. Basta editar para adicionar mais detalhes, como citações ou documentação para que outras pessoas possam confirmar que sua resposta está correta. Você pode encontrar mais informações sobre como escrever boas respostas na Central de Ajuda.
    – Comunidade Bot
    24/11/2022 às 11:48

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .