HTML & CSS - Criando o Card da Seção Hero - Projeto Front-end (HTML, CSS e Javascript) [Aula 2/7]

Quer saber mais sobre o nosso Curso Completo de HTML e CSS? Clique no link abaixo para garantir sua vaga na próxima turma: https://dlp.hashtagtreinamentos.com/html-css/espera/impressionador?origemurl=hashtag_yt_org_listaesperahc_Obrj2dFbZ8U PARA BAIXAR O MINICURSO GRATUITO DE HTML E CSS: https://pages.hashtagtreinamentos.com/inscricao-minicurso-basico-html-css2?origemurl=hashtag_yt_org_minihtmlcss_Obrj2dFbZ8U ----------------------------------------------------------------------- ► Arquivos Utilizados no Vídeo: https://pages.hashtagtreinamentos.com/arquivo-htmlcss-1MxADSWH3jPAJeAivI0y3cGNRecMzncxl?origemurl=hashtag_yt_org_planilhahc_Obrj2dFbZ8U ► Site da MasterClass de Full Stack que foi Utilizada na Aula: https://lp.hashtagtreinamentos.com/full-stack/aula/inscricao ----------------------------------------------------------------------- Caso prefira o vídeo em formato de texto: https://www.hashtagtreinamentos.com/landing-page-html-e-css ----------------------------------------------------------------------- PARA CONTRATAR A HASHTAG PARA SUA EMPRESA: https://www.hashtagtreinamentos.com/treinamentos-corporativos?fonte=yt ----------------------------------------------------------------------- Fala Impressionadores! Hoje vamos para a segunda aula do Curso de HTML e CSS que tem como objetivo te ensinar a criar uma Landing Page do ZERO! Nessa aula nós vamos criar o card da seção hero da nossa landing page, ou seja, vamos aprender muitas coisas nessa aula. Vou te mostrar como fazer a formatação do container, como fazer alteração de fonte no CSS, como alterar o tamanho da fonte no CSS, como utilizar o display flex e muito mais! A ideia dessa aula é deixar o nosso card praticamente pronto, então vamos fazer todos os ajustes de espaçamento, fonte, tamanho de fonte, alinhamento de imagens e texto. E ainda vamos fazer a formatação do botão e da parte da data, que se assemelha a um botão, então vamos ter uma borda para delimitar o conteúdo e ajuste do texto. Além disso, vamos fazer os ajustes no botão, incluindo o hover no CSS, que é aquele visual de quando passa o mouse em cima do botão ele altera o cursor e você, de fato, nota que se trata de um botão! Agora vamos pra aula que tem muito conteúdo irado hoje! ----------------------------------------------------------------------- Vídeos Recomendados ► Curso Básico de HTML e CSS https://www.youtube.com/watch?v=vtX9BzESWnQ&list=PLpdAy0tYrnKwmcenKePWr9TQ9deRanAr7&pp=iAQB ► Como Baixar e Configurar o VSCode para HTML e CSS https://youtu.be/WyXcfCPlIlk ----------------------------------------------------------------------- Hashtag Programação ► Inscreva-se em nosso canal: http://bit.ly/3c0LJQi ► Ative as notificações (clica no sininho)! ► Curta o nosso vídeo! ----------------------------------------------------------------------- Redes Sociais ► Blog: https://bit.ly/2MRUZs0 ► YouTube: http://bit.ly/3c0LJQi ► Instagram: https://bit.ly/3o6dw42 ► Facebook: http://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 01:31 O que vamos fazer? 02:35 Formatações do container + ajustes 17:14 Flex Container e Flexbox + flexbox editor 20:30 Alteração de fonte no CSS 23:10 Tamanho da fonte no CSS + formatação 34:33 Ajuste de espaçamento do texto 35:18 Itens de lista + espaçamento 37:16 Display flex (alinhamento texto e imagem) 42:14 Display flex (alinhamento + bordas) 44:47 Botão + cursor pointer + ajuste de texto 48:50 Hover no CSS 50:05 Conclusão #htmlecss #htmlcss #html #css #hashtagprogramacao