Summary
Keywords
Full Transcript
Domine o alinhamento de contêineres no CSS Grid Layout! Nesta aula teórica do curso de HTML5 e CSS3, Gustavo Guanabara descomplica as propriedades align-items, justify-items, align-content e justify-content. Aprenda a diferença crucial entre alinhar itens individuais e o conteúdo geral da grade, tanto vertical (align) quanto horizontalmente (justify). Entenda valores como start, center, end, stretch, space-between, space-around e space-evenly com exemplos visuais claros. Assuntos Abordados (Capítulos): 00:00 - Novas propriedades do contêiner grid 00:36 - Vídeo anterior prático sobre Grid View. 02:08 - Propriedades já vistas (display, template, gap). 02:54 - As 4 novas propriedades de alinhamento. 03:08 - align (vertical) vs justify (horizontal). 04:09 - Alinhar items vs alinhar content. 05:49 - Usando o align-items 08:03 - Usando o justify-items 09:11 - Aumentando o tamanho do contêiner. 09:28 - Usando o align-content 10:24 - Valores start, center, end. 11:00 - Valor space-between 12:00 - Valor space-evenly 12:39 - Valor space-around 14:13 - justify-content: Alinhamento horizontal do conteúdo. 14:48 - Valores justify-content: start, center, end. 14:53 - Valor justify-content: space-between: Espaço distribuído entre colunas. 15:09 - Valor justify-content: space-evenly: Espaço horizontal distribuído igualmente. 15:32 - Valor justify-content: space-around: Espaço horizontal igual ao redor. 16:03 - Dica Final 17:04 - O que veremos na próxima aula? O Curso de HTML5 e CSS3 vai ensinar a criar sites usando a linguagem de marcação hipertexto (HTML) e folhas de estilo em cascata (CSS), todas em suas versões mais recentes. Neste curso, o Professor Gustavo Guanabara criou um conjunto de vídeos, exercícios, desafios e um material de apoio em forma de e-book com 30 capítulos ao todo. Acesse o material de apoio em PDF: == GitHub: https://github.com/gustavoguanabara/html-css/tree/master/aulas-pdf Receba notificações de novos vídeos: == Canal no Telegram: https://t.me/cursoemvideo Acompanhe todos os vídeos do Módulo 1 do Curso de HTML5 e CSS3: == Módulo 01: https://www.youtube.com/playlist?list=PLHz_AreHm4dkZ9-atkcmcBaMZdmLHft8n Acompanhe todos os vídeos do Módulo 2 do Curso de HTML5 e CSS3: == Módulo 02: https://youtube.com/playlist?list=PLHz_AreHm4dlUpEXkY1AyVLQGcpSgVF8s Acompanhe todos os vídeos do Módulo 3 do Curso de HTML5 e CSS3: == Módulo 03: https://www.youtube.com/playlist?list=PLHz_AreHm4dmcAviDwiGgHbeEJToxbOpZ Acompanhe todos os vídeos do Módulo 3 do Curso de HTML5 e CSS3: == Módulo 04: https://www.youtube.com/playlist?list=PLHz_AreHm4dkcVCk2Bn_fdVQ81Fkrh6WT Consiga certificados fazendo o curso diretamente pelo site oficial do projeto: == Site: https://www.cursoemvideo.com Torne-se apoiador do projeto: == Acesse: https://www.cursoemvideo.com/apoie Siga-nos nas redes sociais: == Gustavo Guanabara no Instagram: https://www.instagram.com/gustavoguanabara == Curso em Vídeo no Instagram: https://www.instagram.com/cursoemvideo == Hostnet no Instagram: https://www.instagram.com/hostnetbr == Estudonauta no Instagram: https://www.instagram.com/estudonauta Conheça os patrocinadores desse curso: == HOSTNET: https://www.hostnet.com/cursoemvideo == RECODE: https://www.recode.org.br/novidades == ESTUDONAUTA: https://www.estudonauta.com/cursoemvideo #cursohtml5css3 #modulo05 #C28A05
