Desenvolvimento Web com Front-End - Aprendendo do Zero" HTML, CSS e JS - 😉Como Fazer Botão com Efeito Hover | Html e Css

#LayoutResponsive #FrontEnd #Css3 #Html5 📚 Muito Obrigado por Assistir! 📌Saiba Mais https://www.youtube.com/c/WebOnlineDesenvolve 📌 https://github.com/WebOnlineDesenvolve 00:00 INTRODUÇÃO CABEÇALHO HTML5 00:30 INICIO DO CORPO DO HTML 01:06 ESTILO CSS 01:28 FLEXBOX 01:50 COMO CRIAR UM BOTÃO 02:40 COMO FAZER TEXT SHADOW COM EFEITO HOVER 03:37 CRIANDO BORDAS ANIMADA DO BOTÃO COM SPAN 1 04:46 COMO CRIA ANIMAÇÃO DE BOTÃO COM @KEYFRAMES - SPAN 1 05:12 CRIANDO BORDAS ANIMADA DO BOTÃO COM BACKGROUND LINEAR GRADIENTE 06:15 COMO ANIMAR BOTÃO @KEYFRAMES - SPAN 2 06:40 COMO COLOCAR BACKGROUND IMAGE LINEAR GRADIENTE BOTÃO --SPAN 3 07:40 ANIMAÇÃO DO SPAN 3 08:05 CRIANDO ANIMAÇÃO NAS BORDAS DO BOTÃO - SPAN 4 09:05 ANIMANDO SPAN 4 COM @KEYFRAMES Nesse vídeo vamos criar um botão com sombra de texto e efeito hover , colocando bordas animada com background linear gradiente. |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| Os Mais Vendidos na Amazon em Computadores e Informática: https://amzn.to/3nWnCbr Mais Vendidos em Games e Consoles: https://amzn.to/3ufq8ed Mais Vendidos em Dispositivos Amazon e Acessórios: https://amzn.to/3EEfulQ Mais Vendidos em Apps e Jogos: https://amzn.to/39whbU9 Notebook: https://amzn.to/3EJk5TK Pcs: https://amzn.to/3zrgaas |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| ✨IDE: ( Integrated Development Environment )Microsoft Visual Studio. ✨IDE: ( Integrated Development Environment ) Visual Studio Code. EXTENSÕES VISUAL STUDIO CODE: LIVE SERVER: Carrega a página automaticamente. BEAUTIFY : Padroniza a formatação do código COLOR HIGHLIGHT : Mostra as cores que você está criando no arquivo css. INTELLISENSE FOR CSS: Fornece o auto completo da classe que você escreveu no seu código. ✨Software Editor de videos: Shotcut. ✨Software para gravar a tela do computador: OBS Studio. *********************************************** TELA FINAL DO VÍDEO: Saiba Mais: Canal do Savio Ferraz - Animações feitas por @Savio Ferraz ************************************************* Google Fontes: https://fonts.google.com/ ⭐ Biblioteca JavaScript https://cdnjs.cloudflare.com/ajax/libs/gsap/2.1.3/TweenMax.min.js Fontes de ícones 🔎https://fontawesome.com/v5.15/icons?d=gallery&p=2 🔎https://fontawesome.com/ Ambiente de Desenvolvimento: codepen.io HTML E CSS: 🔎https://www.w3schools.com/default.asp Tabelas de cores: 🔎https://www.flextool.com.br/tabela_cores.html Imagem para baixar: 🔎https://pixabay.com/pt/ Site para criar Thumbnails: 🔎https://www.canva.com/