Saindo do Zero em Animações no CSS em 10 minutos (animation e @keyframes)

แชร์
ฝัง
  • เผยแพร่เมื่อ 4 ก.พ. 2025
  • Quer saber mais sobre o nosso Curso Completo de HTML e CSS? Clique no link abaixo para garantir sua vaga na próxima turma:
    dlp.hashtagtre...
    PARA BAIXAR O MINICURSO GRATUITO DE HTML E CSS:
    pages.hashtagt...
    -----------------------------------------------------------------------
    ► Arquivos Utilizados no Vídeo:
    pages.hashtagt...
    -----------------------------------------------------------------------
    Caso prefira o vídeo em formato de texto:
    www.hashtagtre...
    -----------------------------------------------------------------------
    PARA CONTRATAR A HASHTAG PARA SUA EMPRESA:
    www.hashtagtre...
    -----------------------------------------------------------------------
    Fala Impressionadores! Quer saber como sair do zero em animações no CSS em 10 minutos?
    Hoje eu vou te mostrar como fazer transições no CSS para que possamos animar um botão. Aposto que você já viu em algum site um botão que fica aumentando e diminuindo de tamanho de forma automática, não é mesmo?
    Nessa aula eu vou te mostrar exatamente como fazer isso usando o @keyframes, a ideia é que a gente consiga alterar a escala do botão, mas de forma suave e contínua, não aquela mudança brusca direta.
    Por isso que a animação é tão importante, pois ela deixa a transição mais suave e dá essa ideia de movimento!
    E aí, bora aprender a fazer animação em botão no CSS? Vem comigo que você vai aprender isso tudo em 10 minutos!
    -----------------------------------------------------------------------
    Vídeos Recomendados
    ► Curso Básico de HTML e CSS
    • Curso Básico de Html e...
    ► Como Baixar e Configurar o VSCode para HTML e CSS
    • Instalação do VS Code ...
    -----------------------------------------------------------------------
    Hashtag Programação
    ► Inscreva-se em nosso canal: bit.ly/3c0LJQi
    ► Ative as notificações (clica no sininho)!
    ► Curta o nosso vídeo!
    -----------------------------------------------------------------------
    Redes Sociais
    ► Blog: bit.ly/2MRUZs0
    ► TH-cam: bit.ly/3c0LJQi
    ► Instagram: bit.ly/3o6dw42
    ► Facebook: bit.ly/3qGtaF2
    Aqui nos vídeos do canal da Hashtag Programação ensinamos diversas dicas de HTML e CSS para que você consiga se desenvolver nessa linguagem de programação e criar seus próprios projetos!
    -----------------------------------------------------------------------
    Conteúdo da Aula
    00:00 Introdução
    00:35 Cursor pointer e hover no botão
    02:15 Parte de animação no CSS
    02:34 Transição no CSS
    04:30 Animação no CSS (@keyframes etapas da animação)
    10:49 Conclusão
    #htmlecss #htmlcss #html #css #hashtagprogramacao

ความคิดเห็น • 4

  • @moderacaohashtag
    @moderacaohashtag 8 หลายเดือนก่อน +1

    Fala galera!
    Gostou do vídeo? Deixa a sua curtida e se inscreve no canal!
    PARA BAIXAR O MINICURSO GRATUITO DE HTML E CSS:
    pages.hashtagtreinamentos.com/inscricao-minicurso-basico-html-css?origemurl=hashtag_yt_org_minihtmlcss_5HTvRE64a-g
    ► Arquivos Utilizados no Vídeo: pages.hashtagtreinamentos.com/arquivo-htmlcss-1h4y7_T_AKnAzXwmWZFqdEC3WVaGUnabD?origemurl=hashtag_yt_org_planilhahc_5HTvRE64a-g
    ► Blog: bit.ly/2MRUZs0
    ► TH-cam: bit.ly/3c0LJQi
    ► Instagram: bit.ly/3o6dw42
    ► Facebook: bit.ly/3qGtaF2
    Playlists Recomendadas:
    ► Curso Básico de HTML e CSS th-cam.com/video/vtX9BzESWnQ/w-d-xo.html&pp=iAQB

  • @alinegomes9084
    @alinegomes9084 7 หลายเดือนก่อน

    Excelente explicação 👏👏

  • @NayT0N
    @NayT0N 7 หลายเดือนก่อน +1

    Excelente aula. Faça uma aula com animações com SVG.

  • @rafaelsantana1141
    @rafaelsantana1141 8 หลายเดือนก่อน

    Primeiro aqui😎