Imagem do Curso gratuito Flexbox CSS do zero ao avançado

Curso online gratuitoFlexbox CSS do zero ao avançado

Duração do curso online: 30 minutos

Novo

Curso gratuito de Flexbox CSS do básico ao avançado para criar layouts responsivos, alinhar elementos e controlar espaço, ordem e tamanho no Front-End.

Neste curso gratuito, aprenda sobre

  • Fundamentos do Flexbox: ativação e direção
  • Alinhamento e espaçamento no container flex
  • Dimensionamento e ordem dos itens flex

Descrição do curso

Aprenda a dominar o layout moderno da web com Flexbox CSS, saindo do básico até técnicas mais avançadas para organizar elementos com precisão e rapidez. Este curso online gratuito é ideal para quem está começando no Front-End e também para quem já cria interfaces e quer ganhar mais controle sobre alinhamento, distribuição de espaço e comportamento responsivo.

Ao longo das aulas, você vai entender como estruturar containers flexíveis e como as principais propriedades influenciam a direção dos itens, a quebra de linha, o alinhamento horizontal e vertical, além do espaçamento entre componentes. Você também vai aprender a lidar com redimensionamento inteligente, definindo quando um item deve encolher ou crescer em relação aos demais, e como reorganizar a ordem dos elementos sem alterar o HTML.

Com uma abordagem prática, o conteúdo ajuda a resolver problemas comuns de layout, como centralização, criação de barras de navegação, grids flexíveis e seções responsivas para diferentes tamanhos de tela. Ao final, você terá mais segurança para montar páginas mais consistentes, limpas e adaptáveis usando apenas CSS.

Conteúdo do curso

  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 1 - Introdução ao Flexbox 04m
  • Exercício: Qual propriedade deve ser aplicada no contêiner para que os itens passem a se organizar em linha e aproveitem melhor o espaço disponível?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 2 - Explorando o Poder do flex-direction no CSS Flexbox! 04m
  • Exercício: Qual propriedade do Flexbox define a direção em que os itens serão organizados no container (horizontal, vertical e reverso)?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 3 - Ajustando Elementos com flex-wrap no Flexbox CSS 02m
  • Exercício: Qual propriedade do Flexbox faz os itens respeitarem seu tamanho e “quebrarem” para a próxima linha quando não há espaço?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 4 - Alinhando elementos na horizontal com Justify Content no Flexbox 05m
  • Exercício: Qual valor de justify-content distribui os itens com espaçamento entre eles, mas sem espaço nas extremidades (início e fim) do container?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 5 - Alinhando elementos na vertical com Align Items no Flexbox CSS 03m
  • Exercício: No Flexbox, qual propriedade é usada para alinhar os itens na vertical (eixo cruzado) em um container?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 6 - Ajustando o espaçamento entre os elementos com o Gap no Flexbox 01m
  • Exercício: No Flexbox, qual propriedade é usada para criar espaçamento uniforme entre os itens (filhos) dentro de um container?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 7 - Redimensionando elementos com Flex Shrink no Flexbox CSS 03m
  • Exercício: No Flexbox, qual propriedade define o quanto um item pode ser reduzido para caber na linha conforme o tamanho da tela?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 8 - Aumentando o tamanho dos elementos com Flex Grow no Flexbox CSS 02m
  • Exercício: Qual é a principal função da propriedade CSS flex-grow em um item flex?
  • Aula em vídeo: Do Zero ao Dev : Flexbox - Aula 9 - Definindo a ordem dos elementos com o Flex Order no Flexbox CSS 04m
  • Exercício: Qual propriedade do Flexbox permite alterar a ordem visual dos itens em um container flex, sem mudar o HTML?

Este curso gratuito inclui:

30 minutos de curso online em vídeo

Certificado digital de conclusão de curso ( Gratuito )

Exercícios para treinar seus conhecimentos

100% gratuito, do conteúdo ao certificado

Pronto para começar?Baixe o app e comece hoje mesmo.

Instale o app agora

para ter acesso ao curso
Ícone representando cursos de tecnologia e negócios

+ de 5.000 cursos gratuitos

Programação, Inglês, Marketing Digital e muito mais! Aprenda o que quiser, gratuitamente.

Ícone de calendário com alvo representando planejamento de estudos

Plano de estudos com IA

A Inteligência Artificial do nosso aplicativo pode criar um cronograma de estudos para o curso que você escolher.

Ícone de profissional representando carreira e negócios

Do zero ao Sucesso profissional

Melhore seu currículo com nosso Certificado gratuito e depois utilize nossa Inteligência Artificial para buscar seu emprego dos sonhos.

Você também pode utilizar o QR Code ou os Links abaixo

QR Code - Baixar Cursa - Cursos Online

Mais cursos gratuitos em Programação Front-End

Ebook + Áudiobooks gratuitos! Aprenda ouvindo ou lendo!

Baixe o Aplicativo agora para ter acesso a + de 5000 cursos gratuitos, exercícios, certificado e muito conteúdo sem pagar nada!

  • Cursos online 100% gratuitos do início ao fim

    Milhares de cursos online em vídeo, ebooks e áudiobooks.

  • Mais de 60 mil exercícios gratuitos

    Para testar seus conhecimentos no decorrer dos cursos online

  • Certificado Digital gratuito válido em todo o Brasil

    Gerado diretamente na galeria de fotos do seu celular e enviado ao seu e-mail

Aplicativo Cursa na tela de ebook, na tela de curso em vídeo e na tela de exercícios do curso, mais o certificado de conclusão de curso