CSS Flexbox - Tudo o que você precisa saber
HTML-код
- Опубликовано: 9 фев 2025
- Você tem dúvidas sobre qualquer parte do CSS Flexbox? Dúvidas no Eixo principal, eixo transversal, alinhamento, responsividade, entre outras? Depois desse vídeo, te garanto que você vai usar o Flexbox com muito mais confiança. Nada de ficar chutando align-items e justify-content aleatoriamente até acertar.
Bora aprender?
Cursos de Python e JavaScript / TypeScript com desconto:
www.otaviomira...
Twitter: / otaviomirandabr
#css #flexbox #html
50:40 É desse jeito que gosto, conteúdo profundo!
Aproveitei para listas o tempo de da tópico da aula:
0:00 - Introdução
0:30 - O que é flexbox?
1:36 - Criando o HTML
3:40 - Estilizando o CSS
5:00 - display: flex;
6:40 - flex-direction: row;
10:30 - justify-content
14:50 - flex-direction: row-reverse;
15:59 - flex-direction: column;
18:39 - gap
20:19 - align-items
25:54 - flex-wrap
28:00 - flex-flow
28:55 - align-content
31:38 - order
36:10 - flex-grow
39:14 - flex-shrink
41:45 - flex-basis
44:00 - Shorthand flex
45:32 - align-self
46:49 - centralizar um elemento usando o flex
48:23 - Tornar um flex-item em flex
Obrigado, nem todo herói usa capa heim!
grato pela aula prof. Queiroz de Angola, em breve serei seu aluno de react, tou lutando pra conseguir uma grana
Manda um e-mail pra mim falando isso (meus contatos estão no perfil do YT).
mano, que isso, segundo video qu vejo seu, to parando no meio do video pra dizer que vc explica muito bem, isso tava dando m nó na minha cabeça kkkkkk ajudou muito. valeu
Você precisava criar um curso de como dar cursos!!!
Parabéns pela didática, primeiro vídeo sobre flex box que realmente explica o comportamento e não fica só descrevendo funções!
Muito boa aula! Parabéns pelo conteúdo e por repassar o conhecimento para outros!
Muito bom, parabéns. Tinha visto vários vídeos e não tinha entendido muito bem, só entendi agora. Show, parabéns!
Olá professor sou seu aluno de javascript e typescript, sou grato pelas aulas aqui do youtube e da udemy, muito conteúdo de qualidade!
Que massa, muito obrigado
Pela primeira vez vi minha vida toda sendo resolvida nos primeiros 10 minutos de vídeo! Gratidão! Conteúdo incrível, 50 minutos de puro aprendizado!
Aula excelente, sem dúvida umas das melhores que tem aqui no YT !!!
gostei muito da didática. Parabéns!!!
Nossa,você não sabe o tanto que carinho que tenho por você mestre. Até hoje me ajudando, sucesso amigo .
Ahh obrigado 🙏
Chegou a luz que eu precisava kkkk, obrigado cara você é fera !
Muito boa guerreiro, já comprei vários cursos seu sempre com uma qualidade absurda super incrível!🎉
Excelente video !! Obrigado por compartilhar seu conhecimento !!!!
Muito bom, sempre com uma ótima didática!
parabéns, e obrigado pelo conteúdo.
Top Top de mais valeu man, estava a algum tempo atrás de uma explicação assim, simples e direta, ganhou um inscrito.😅😅😅😅
Muito obrigado, por esse resumo, já sabia digamos 50% do flexbox, depois desse vídeo cheguei a 99%, o outros 1%, será fazendo na prática .
Cara... que aula sensacional, esclareceu muita coisa. Valeu mestre Otavio!
Vc é demais amigo. Gostei da aula!!!!
Sou aluno do curso de javascript e python lá da udemy, vc eh o melhor professor, parabéns e muito obrigado mestre 😁
Obrigado, de coração 🥰
Obrigado pela excelente explicação professor, eu estava com dificuldade em compreender esses conceitos.
Obrigado por essa video aula sobre display flex! Aprendi muito sobre como usar essa propriedade para organizar elementos HTML de maneira mais eficiente e flexível. Fiquei surpreso com a quantidade de opções e recursos disponíveis para trabalhar com o flexbox e como eles podem ser facilmente aplicados em projetos web. Agradeço pela clareza e paciência ao explicar cada conceito e exemplo. Estou ansioso para colocar em prática o que aprendi e continuar aprendendo mais sobre essa poderosa ferramenta de design web. Muito obrigado! Comprei um dos seus cursos na Udemy.
Assisti um aula de mais de 2h em outro canal e sai meio perdido. Não foi ruim de tudo, mas com essa aula, só os primeiros 20 min. foram mais q suficientes para entender. Essa do eixo principal e transversal foi demais! Os detalhes q fazem a gente pensar como as coisas funcionam. Agora, não tem como esquecer. Valeu!
Obrigado pela aula, bem didático. Muitas coisas que eram nebulosas para mim foram sanadas.
Valeu mestre😀. Excelente aula. Sugestão: Colocar na descrição do vídeo o link da playlist em que esse vídeo está.
Show, valeu
Conteúdo sempre top! Um dos melhores! professores!
Excelente aula, obrigado.
Vc eh MT fera Otávio! Seu curso da Udemy eh bom demais 😍
Que aula excelente!
Muito bom, ainda compro todos seus cursos da udemy, já estou na caminhada
Top de mais de mais de mais muito obrigado.
parabéns pelo conteúdo
MEUS AMIGOS QUE AULA!
Professor faz um video explicando melhor o dot env
Achei aqui, gostei comprei na Udemy seus cursos. Ótima didatica!
Obrigado 🙏
Excelente explicação! Obggg
Valeu!
Desculpa a demora, eu realmente não tinha visto seu comentário. Agradeço demais =)
Flexbox é vida, e o grid tbm👍😂
Sensacional!!!
Adoro o seu conteudo professor.
Sou seu aluno na Udemy e curto muito o conteúdo. Se puder faz um video desse porém de GRID
Podexa
+1 inscrito!
Aula show!
eixo padrão: HORIZONTAL - em linha
segundo eixo: VERTICAL - em coluna
Dica para entender sobre eixos, estude um pouco de matemática cartesiana.
"Main Axis" é o eixo X, "Cross Axis" é o eixo Y.
só uma sugestão, funcionou pra mim :)
Boa
Muito bom este vídeo, esclareceu bastante o uso de flex. Você tem um deste mesmo tipo para grid? Não achei no teu canal.
Ainda não tem, mas estou providenciando
Muito bom 👏
Obrigado 👍
Excelente conteúdo!
Valeu 🙏
Muito bom
Muito Boa Tarde Otávio...
Quando poder lança uma vídeo aula fazendo um design responsivo utilizando o mínimo de design adaptativo e mais design responsivo, se é que você me entende.
Ex: Com o mínimo de media query e break points possível deixa tudo no automático, quebra de linha e etc
Sei que tem um monte de vídeo aulas fazendo, más com você ensinando eu entendo muito mais e sempre tem as sacadinhas que você passa
@@henriqueteixeiradev4751 eu acho que já vamos ter... Acompanha aí esse curso de HTML, que nele devemos ter algo similar a isso.
@ opa legal
Professor, seu curso de react e next.js é uma versão aprofundada do curso javascript, assim como o de Django é uma versão aprofundada da sessão Django no curso de python?
Exatamente...
😃
Com o Flexbox o float ficou depreciado ou ainda tem casos em que pode ser usado?
É raro eu usar, mas você pode colocar uma imagem em volta de um texto com float.
O que aconteceu nesse momento? 3:09
Abreviation para poupar tempo
eu tenho pai com display flex e um Filho e dentro do filho tenho outro eu quero mover o Filho dentro do filho como eu faria
Desculpa eu te perguntar, como você fez para emagrecer? Obrigada, tá muito esbelto =D
Sem problema, acho que vou criar um canal sobre isso. Mas em resumo, dieta e musculação.
@ Nossa que show, também estou nessa empreitada. Bjo. Obrigada por responder
só nao dou dois joinhas por que nao da
Pra quem quer treinar um pouco esses comandos do flexbox, pesquisem "Flexbox Froggy", vai ajudar muito em fixar o conteúdo
Sensacional!!!!!