Curso de Flexbox: Posicione elementos na tela

9,5

Nota desse curso

6.319

Alunos neste curso

Faça esse curso de HTML e CSS e:

  • Aprenda a famosa especificação flexible box para posicionar seus elementos na página
  • Entenda as diversas propriedades do flexbox e como usá-las
  • Entenda como as propriedades do flexbox substituem float, inline e inline-block
  • Elabore um site responsivo com flexbox

Conteúdo Detalhado

  1. Introdução e Cabeçalho da página

    • Projeto Alurinha
    • O que é flexbox?
    • Nos livrando dos floats, inline e inline-blocks
    • Espaçando os elementos com justify-content
    • Alinhando verticalmente os elementos com align-items
  2. Fazendo o rodapé

    • Mais formas de espaçamento com space-around
    • Mudando a direção de renderização do flex
    • Quebrando os elementos para outras linhas
  3. Fazendo o grid de cursos

    • Juntando as coisas que vimos até agora
    • Limitações do flex
    • Fazendo um grid com flex
  4. Adaptando para mobile

    • Fluxo dos elementos em um contexto mobile
    • Mudando a ordem dos elementos
  5. Mais sobre flexbox & desafios

    • Nomenclatura oficial do flexbox
    • Fazendo os flex items crescer com flex-grow
    • Agora fazendo eles diminuírem elegantemente com flex-shrink
    • Definindo largura e altura de flex items com flex-basis
    • Invertendo a ordem de renderização dos elementos

Primeira aula de Flexbox: Posicione elementos na tela

Formação com esse curso

Instrutores

  • Yuri é desenvolvedor full-stack, formado em Tecnologia de Informação pela USP. Como instrutor de cursos presenciais (Front-end, Java e PHP, Spring e MySQL) sumarizou mais de 1 000 horas de aulas ministradas.

Cursos relacionados

Cursos de HTML e CSS em Front-end

Público alvo

Desenvolvedor front-end com experiência em HTML e CSS e que já tenha sofrido com posicionamento de elementos na página

Nível de Dificuldade

Intermediário

Já é aluno?

Começar o Curso

Experiências de quem já estudou com a gente

Marco Antonio

em 16/09/2019

Achei ótimo separa este tema em um curso, permitiu entender o assunto plenamente e se aprofundar. Contéudo muito bom, instrutor muito bom.

Flexbox: Posicione elementos na tela

Keroly Barbosa

em 05/05/2019

O instrutor ministrou muito o curso. O projeto base foi excelente também. As explicações foram claras e no ponto. Recomendo o curso.

Flexbox: Posicione elementos na tela

Andre Graca

em 01/05/2019

Gostei muito da didática do professor, vi um video no Youtube com a introdução desse curso e vim fazer, pois precisso dessa funcionalidade do css para criar uma página de um projeto em que faço parte.

Flexbox: Posicione elementos na tela

Sabe quando você pode começar? Agora!

  • 876 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

Premium

  • 876 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$75
à vista R$900
Matricule-se

Premium Plus

  • 876 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$100
à vista R$1.200
Matricule-se

Max

  • 876 cursos

    Cursos de programação, UX, agilidade, data science, transformação digital, mobile, front-end, marketing e infra.

  • Certificado de participação

    Certificado de que assistiu o curso e finalizou as atividades

  • App para Android e iPhone/iPad

    Estude até mesmo offline através das nossas apps Android e iOS em smartphones e tablets

  • Projeto avaliado pelos instrutores

    Projeto práticos para entrega e avaliação dos professores da Alura com certificado de aprovação diferenciado

  • Acesso à Alura Start

    Cursos de introdução a tecnologia através de games, apps e ciência

  • Acesso à Alura Língua

    Reforço online de inglês e espanhol para aprimorar seu conhecimento

12X
R$120
à vista R$1.440
Matricule-se
Acesso por 1 ano
Estude 24h/dia onde e quando quiser
Novos cursos toda semana