Перейти к содержимому

Como criar um SLIDER CARROUSEL 3D com HTML, CSS e JavaScript

Leo Vargas

0:00 / 0:00

Como criar um SLIDER CARROUSEL 3D com HTML, CSS e JavaScript

1 817 просмотров · 2 г. назад
Leo Vargas
5,32 тыс. подписчиков
1 817 просмотров · 2 г. назад
Neste tutorial passo a passo, você aprenderá a criar um carrousel 3D com tigelas de smoothies ao usar HTML, CSS e Javascript. Faça o download dos arquivos iniciais: Repositório github https://github.com/leovargasdev/youtu... Google drive https://drive.google.com/file/d/1HslJ... 🎥 𝗢𝗨𝗧𝗥𝗢𝗦 𝗩𝗜𝗗𝗘𝗢𝗦 • Aprendendo CSS com a tela do Airbnb    • Aprendendo CSS com a tela do Airbnb   • Como personalizar o VSCODE    • Aprenda a personalizar o VSCode - Tema, co...   • Criando o site do Mario    • Criando o site do filme Super Mario Bros c...   ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ 🏘 𝗖𝗢𝗠𝗨𝗡𝗜𝗗𝗔𝗗𝗘 𝗡𝗢 𝗗𝗜𝗦𝗖𝗢𝗥𝗗   / discord   ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ 📱𝗥𝗘𝗗𝗘𝗦 𝗦𝗢𝗖𝗜𝗔𝗜𝗦 ⮞ Twitch:   / leovargasdev   ⮞ Instagram:   / leuvargas   ⮞ Twitter:   / leovargasdev   ⮞ Github: https://www.github.com/leovargasdev ⮞ Linkedin:   / leonardo-luis-de-vargas   ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ 💻 𝗦𝗘𝗧𝗨𝗣 Notebook Dell (https://amzn.to/48080ra) Tela 1: Monitor AOC(https://amzn.to/3NAJq8L) Suporte Ergonômico ELG (https://amzn.to/3t0i1G5) Hub USB C p/ usar na 2ª tela (https://amzn.to/3uI2jjs) Webcam Logitech BRIO (https://amzn.to/3RDm4BP) Microfone Blue Yeticaster (https://amzn.to/3sW32wW) Teclado Redragon Varuna (https://amzn.to/3T8Dkji) Mouse Logitech G300s (https://amzn.to/3Rtnfn4) Mouse Pad (https://amzn.to/3Rtnfn4) Estante (https://amzn.to/46KgVfr) ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁ 📑 𝗦𝗨𝗠𝗔𝗥𝗜𝗢 𝗗𝗢 𝗩𝗜́𝗗𝗘𝗢 00:00 Introdução 00:47 Apresentando a estrutura do projeto 02:04 Estruturando o html 06:14 Estilizando o body 07:45 Estilizando o header.css 09:55 Estilizando o main.css 13:45 Efeito de hover nos sabores 18:17 Efeito de rotação entre os sabores 30:05 Circulo de fundo 33:55 Considerações finais #html #animação #ladingpage #css #javascript #carrousel3d