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

Curso online gratuito Flexbox CSS do zero ao avançado

Name: Flexbox CSS do zero ao avançado
Availability: InStock

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

Sobre o curso online gratuito

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?

Aprenda sobreCSS

Aprimore suas habilidades em web design com cursos gratuitos de CSS online! Domine estilos, layouts e animações para criar sites visualmente impressionantes. Inscreva-se já!

Aprenda sobreHTML

Aprenda HTML grátis com nossa seleção de cursos online! Domine a estrutura da web e crie sites incríveis. Ideal para iniciantes. Inscreva-se já e comece a codificar!