Fundamentos do CSS Flexbox

Aprenda distribuir, alinhar e posicionar elementos HTML com a propriedade flexbox do CSS

5.00 (139 reviews)
Udemy
platform
Português
language
Web Development
category
instructor
Fundamentos do CSS Flexbox
1,671
students
1 hour
content
Oct 2021
last update
FREE
regular price

What you will learn

Utilizar o flexbox para desenvolver websites responsivos

Posicionar elementos HTML em linha ou coluna

Determinar fluxo, espaçamento e ordem dos elementos HTML

Dominar as propriedades do flexbox

Description

O HTML e o CSS são as principais linguagens computacionais para desenvolver websites. O HTML é utilizado para fazer a marcação da página, permitindo estruturar o website. O CSS é responsável pelo design do website, permitindo posicionar elementos, alterar cor e tamanho, fazer animações e layouts responsivos. Essas duas linguagens unidas com a linguagem de programação JavaScript formam um trio perfeito para desenvolver websites profissionais.

Nesse curso abordamos os conceitos fundamentais da propriedade flexbox do CSS3. Esta propriedade permite posicionar os elementos HTML de uma maneira muito simples. Com Flexbox é possivel distribuir os elementos em linha ou coluna, permite mudar o sentido do posicionamento, definir espaços  e também alinhar os elementos.

Antes de existir a propriedade Flexbox era muito difícil posicionar os elementos de uma maneira rápida e eficiente. Muitas vezes tínhamos que usar a propriedade float, position ou até mesmo recorrer a propriedade display table. Realmente era muito complicado manter um projeto dessa forma, mas o Flexbox veio pra revolucionar e simplificar o desenvolvimento de interfaces web de usuários.

Pensando em ajudar os desenvolvedores iniciantes, estou disponibilizando gratuitamente esse curso que possui quatro módulos do meu curso Desenvolvimento de websites profissionais com React e Next.js - 2021 (Frontend)

Se você  esta iniciando sua jornada como programador web esse é  um passo fundamental, todas etapas iniciais são abordadas explicando todo o passo a passo. Esse curso foi elaborado para passar o máximo de informação no menor tempo possível, afim de otimizar o tempo do aluno.

Após concluir este esse curso o aluno estará apto a  estudar outros assuntos mais avançados, como: formulários, flexbox, grid layout, propriedades position, animações, layout responsivo etc.

Content

Introdução

Introdução
Criando um container flexbox
Criando um item flex
Direção e Eixo

Alinhamento Itens

Alinhando Itens do Eixo Principal
Alinhando Itens do Eixo Transversal
Alinhando Apenas um Item no Eixo Transversal

Distribuição e Ordem dos Itens

Colocando os Itens em Várias Linhas ou Colunas
Alinhando Linhas ou Colunas
Alterando Ordem do Item

Largura e Comprimento dos Itens

Entendendo a Largura e Altura dos Itens
Definindo Comprimento Inicial dos Itens
Aumentando o Comprimento dos Itens
Encolhendo Comprimento dos Itens
Definindo Comprimento dos Itens

Reviews

Alexsandro
October 22, 2023
Extremamente detalhado e completo sobre o assunto. Recomendo para conhecer essa função, que até então, não conhecia.
Gustavo
March 20, 2023
Muito bom, Fundamental para aprender a criar designs responsivos, estou ansioso para aplicar estes fundamentos em algum projeto.

Charts

Price

Fundamentos do CSS Flexbox - Price chart

Rating

Fundamentos do CSS Flexbox - Ratings chart

Enrollment distribution

Fundamentos do CSS Flexbox - Distribution chart

Related Topics

4288184
udemy ID
9/8/2021
course created date
10/23/2021
course indexed date
Bot
course submited by