Fale com a gente no WhatsApp Fale com a gente no WhatsApp

Curso de HTML5 + CSS3 - Dominando o Flexbox

Conheça os recursos do módulo Flexbox do CSS e aprenda como utilizá-lo nos seus projetos

Nível Iniciante Categoria Desenvolvimento Front-end

  • Curso com 01h32 de vídeos
  • Certificado com 6 horas
  • 12 exercícios

Sobre o curso

O CSS Flexible Box Layout, conhecido como Flexbox, é um modelo de layout do CSS. O Flexbox permite que os elementos responsivos dentro de um container sejam organizados automaticamente, de forma responsiva e manipulável. Um dos modelos mais conhecidos e utilizados do desenvolvimento Front-end

O CSS Flexible Box Layout, conhecido como Flexbox, é um modelo de layout do CSS. O Flexbox permite que os elementos responsivos dentro de um container sejam organizados automaticamente, de forma responsiva e manipulável. Um dos modelos mais conhecidos e utilizados do desenvolvimento Front-end

O que irá aprender?

Neste curso você irá aprender a como trabalhar com essa ferramenta extremamente poderosa e utilizada no desenvolvimento Front-end que é o Flexbox. Você verá os principais modos de utilização e também os atributos mais usados. Também veremos em situações reais como aplicar tudo que aprendemos no decorrer do curso.

Dentre várias outras coisas, você verá:

  • Quais situações aplicar o Flexbox;
  • Tipos de display;
  • Flex Direction;
  • Justify Content;
  • Align Items;
  • Order;
  • Gap;
  • Flex Wrap;
  • Align Self.

Pra quem é esse curso?

Esse curso é para você que quer entender de fato como o Flexbox funciona na prática, onde aplicar e suas propriedades. Esse curso também é indicado para pessoas que querem se aprofundar no CSS e melhorar o conhecimento com Front-end.

Quais os pré-requisitos para esse curso?

Os pré-requisitos não são obrigatórios, são apenas sugestões. Eles dão uma base de parte do conhecimento que é interessante ter para um bom aproveitamento nesse curso.

Metodologia

  • Videoaulas
  • Texto e imagens
  • Início Imediato
  • Testes de aprendizado

Ambiente do curso

  • Google Chrome
  • Visual Studio Code

Sobre o professor

Amauri Blanco Corrêa

Amauri Blanco Corrêa

Estudante de Análise e Desenvolvimento de Sistemas, apaixonado por tecnologia. Atualmente focado na área de front-end e iniciando uma grande e brilhante caminhada tanto profissionalmente quanto pessoalmente nesse universo que é a programação.

Conteúdo programático

  1. Introdução

    Nessa aula vamos preparar o ambiente de desenvolvimento onde iremos criar nossos exemplos. Vamos entender o que é display e seus diferentes tipos.

    6 aulas
    • Apresentação do curso
    • Preparando ambiente de estudo
    • Comportamento padrão dos elementos
    • Diferentes tipos de Display
    • Como o Flexbox funciona
    • Questionário
  2. Flexbox no modo Row

    Veremos como alteramos comportamentos do flex contêiner e várias propriedades fundamentais do Flexbox em linha.

    7 aulas
    • O código-fonte deste curso está no GitHub!
    • Flex direction
    • Justify content
    • Gap
    • Align items
    • Flex wrap
    • Questionário
  3. Flex no modo Column

    Vamos aprender a alterar o sentido em que trabalhamos com nossos elementos, manipulando totalmente nosso flex contêiner.

    6 aulas
    • Flex direction
    • Justify content
    • Align items
    • Gap
    • Flex flow
    • Questionário
  4. Flex item

    Nessa aula iremos vamos aprender a alterar o comportamento de um ‘item’ em específico, sem modificar todos os itens dentro do contêiner.

    4 aulas
    • Align self
    • Flex grow
    • Order
    • Questionário
  5. Uso real do Flexbox

    Nesta aula iremos vamos aplicar os conhecimentos vistos nas aulas anteriores e aplicar em um menu de navegação e manipulação de uma estrutura de cards.

    3 aulas
    • Criando Header
    • Criando estrutura de Cards
    • Aplicando Flexbox nos Cards
Download da ementa

Cursos relacionados

Algumas das formações onde esse curso está inserido

Utilizada e amada por milhares! Veja mais opiniões reais

  • Excelente curso. Direto ao ponto. Conteúdo muito bem explicado e detalhado. Sugiro ao Mestre uma sequência desse curso com outros módulos, montando pelo menos uma "single page" somente com Flexbox. Show! ⭐⭐⭐⭐⭐

  • Excelente curso.

  • Muito boa a didática do curso, recomendo a todos.

  • Faz muitos anos que não tinha contato (necessidade) de mexer com html, ainda era da época da transição para o tableless para layout de sites e agora voltei para o mundo do desenvolvimento web e vejo que muitas melhorias e facilidades surgiram. Os cursos do TreinaWeb, incluindo este de flexbox, está sendo fundamental para que eu possa nivelar com as novas tecnologias do mercado. Só tenho a agradecer ao instrutor que passou o conteúdo com bastante tranquilidade e didática e ao TreinaWebpela qualidade do curso. Espero que mantenham sempre a qualidade do produto de vocês e tragam mais e mais conteúdo com qualidade. Meus parabéns !!!

  • Otima platafoma!

  • Ótima didática do professor, conceitos muito claros e exemplos mais claros ainda. Show de bola!

  • Gostei bastante deste curso, bem explicado com exemplos bem práticos e visuais. Bem fácil o entendimento.

    Depoimento - Tathiany
    HTML5 + CSS3 - Dominando o Flexbox
    Tathiany São Paulo / SP
  • Excelente curso

  • Muito bom. Fixei melhores alguns conceitos.

    Depoimento - Gianfranco
    HTML5 + CSS3 - Dominando o Flexbox
    Gianfranco São Paulo / SP

Plano de acesso total!

Tenha um ano de acesso completo a todos os cursos da plataforma, incluindo novos lançamentos, mentoria de carreira e suporte direto com os professores!

Um ano de acesso completo

Contrate agora e tenha acesso ilimitado a todo o nosso portfólio. Isso inclui:

  • 1 ano de acesso a todos os cursos
  • Cursos novos toda semana
  • Suporte direto com professores
  • Aplicativos para Android e iOS
  • Plano de carreira personalizado
  • Certificados digitais inclusos
  • Suporte com SLA de 4 horas úteis
  • Acesso offline através dos apps
Por apenas
12x R$ 75,00 sem juros, no cartão de crédito
Matricule-se agora
Garantia incondicional de satisfação
Garantia incondicional de satisfação

Confiamos tanto nos resultados dos nossos cursos, que criamos uma garantia incondicional de satisfação para você, que são 7 dias de teste!