Summary
Keywords
Full Transcript
Aprenda HTML do zero até os conceitos intermediários, em 1 hora! ⭐ Curso completo de HTML e CSS: https://app.horadecodar.com.br/course/curso-html-e-css-completo/lp 📘 Ebook de Dicas de HTML e CSS: https://app.horadecodar.com.br/ebookpages/boas-praticas-html-e-css 🗃️ Arquivos: https://github.com/matheusbattisti/css_1_hora Arquivos base: Entre no nosso servidor de Discord e me siga nas redes: 🟣 Discord Hora de Codar: https://discord.gg/Veq4mvsWwk 🔴 Instagram: https://www.instagram.com/horadecodar/ 🔷 Telegram: https://t.me/horadecodar Bem-vindo ao nosso curso intensivo de CSS! Em apenas uma hora, você irá aprofundar seus conhecimentos em Cascading Style Sheets, aprendendo a estilizar e dar vida às suas páginas web de maneira profissional. Começaremos explorando os seletores básicos, essenciais para aplicar estilos específicos aos elementos HTML. Você aprenderá a utilizar seletores de elementos, classes e IDs, além de combinar seletores simples para direcionar estilos de forma precisa e eficiente. Compreenderá como estilizar títulos, parágrafos e destacar conteúdos importantes utilizando classes como "destaque" e IDs únicos para elementos específicos. Em seguida, mergulharemos nas propriedades de texto e fontes, onde você descobrirá como personalizar a tipografia do seu site. Abordaremos como definir famílias de fontes, ajustar tamanhos, pesos e alturas de linha para melhorar a legibilidade. Exploraremos o alinhamento de texto, decorações como sublinhado e transformações de texto para maiúsculas ou minúsculas, além de ajustar o espaçamento entre letras para um design mais refinado. Avançando, abordaremos as cores e backgrounds, ensinando como aplicar cores utilizando diferentes notações: nomes de cores, valores hexadecimais, RGB e HSL. Você aprenderá a definir cores de texto e fundos, criando contrastes e harmonias visuais. Exploraremos a aplicação de imagens de fundo, controlando sua repetição, posição e dimensionamento, para criar layouts ricos e envolventes. O entendimento do modelo de caixa (box model) é fundamental em CSS. Neste curso, você compreenderá como margens, bordas, preenchimentos e o conteúdo se relacionam para formar a estrutura dos elementos. Aprenderá a controlar as dimensões dos elementos, utilizar a propriedade "box-sizing" para ajustar o cálculo do tamanho total e criar caixas estilizadas com bordas personalizadas e fundos coloridos. Em layout e display, exploraremos como controlar a exibição dos elementos usando valores de "display" como "block", "inline", "inline-block" e "none". Você entenderá como cada um desses valores afeta o fluxo dos elementos na página. Abordaremos a manipulação do conteúdo excedente com a propriedade "overflow", permitindo que você decida se o conteúdo deve ser cortado, exibido com barras de rolagem ou visível além dos limites da caixa. Aprenderemos sobre float e clear, técnicas que permitem alinhar elementos lado a lado, como em galerias de imagens ou colunas de texto. Você descobrirá como flutuar elementos à esquerda ou à direita e como limpar flutuações para manter a estrutura do layout consistente. Na seção de posicionamento, você entenderá como posicionar elementos de forma estática, relativa, absoluta, fixa e "sticky". Exploraremos como deslocar elementos em relação à sua posição normal, posicioná-los em locais específicos da página e fixá-los na tela ao rolar. Além disso, aprenderá a usar o "z-index" para controlar a sobreposição de elementos, criando camadas e efeitos visuais dinâmicos. Abordaremos também a responsividade e media queries, essenciais para garantir que seu site seja acessível e atraente em diferentes dispositivos e tamanhos de tela. Você aprenderá a aplicar estilos específicos para telas menores, ajustando fontes, cores e layouts para uma experiência otimizada em smartphones e tablets. Finalmente, entraremos no mundo das animações e transições, onde você descobrirá como adicionar interatividade e movimento às suas páginas. Aprenderá a utilizar transições para criar efeitos suaves ao interagir com elementos, como botões que mudam de cor ou ampliam ao passar o mouse. Exploraremos animações com "keyframes", permitindo que você defina movimentos complexos e ciclos contínuos, dando vida e personalidade aos seus projetos. Este curso é ideal para quem deseja aprimorar suas habilidades em CSS e levar suas criações web para o próximo nível. Com uma abordagem prática e focada, você será capacitado a aplicar estilos avançados, criar layouts flexíveis e adicionar animações envolventes aos seus sites.
