Curso HTML5 e CSS3.- Módulo 5 de 5 - Propriedades de container para Grids (parte 4) - @CursoemVideo HTML5 + CSS3

Simplifique e flexibilize seu CSS Grid! Nesta aula teórica (Parte 4), Gustavo Guanabara ensina a usar a função repeat() para reduzir a repetição nas definições de colunas e linhas do grid. Descubra também a poderosa unidade fr (fração), ideal para criar layouts proporcionais e flexíveis. Aprenda como a unidade fr distribui o espaço disponível e como combiná-la com outras unidades como pixels (px) e porcentagem (%) para criar grids complexos de forma eficiente. Assuntos Abordados (Capítulos): 00:00 - Introdução: Simplificando declarações com funções e unidades. 00:35 - Contexto: Parte 4 teórica das propriedades de contêiner grid. 02:15 - Revisão Geral: Propriedades e shorthands vistos anteriormente. 03:50 - Foco da Aula: Função repeat() e unidade fr (fração). 04:37 - Função repeat(): Simplificando valores repetidos (ex: auto auto auto). 05:03 - Aplicando repeat(): Exemplos em grid-template-columns e rows. 05:21 - Combinando repeat() com Shorthands: grid-template mais enxuto. 06:04 - Introdução à Unidade fr: Frações para divisão de espaço. 06:28 - Exemplo com fr: 1fr 1fr 1fr vs auto auto auto. 08:02 - Como fr Funciona: Soma das frações divide o espaço total. 09:09 - auto vs fr: Diferenças e recomendação de uso (fr). 09:53 - Layout Assimétrico com fr: Exemplo 1fr 2fr 1fr. 10:40 - Cálculo com fr (Exemplo 1fr 2fr 1fr): Dividindo o espaço disponível. 13:04 - Misturando Unidades: px, % e fr na mesma declaração. 13:47 - Cálculo com Unidades Mistas: Fixas e % primeiro, fr no restante. 16:17 - Simplificando Unidades Mistas: Usando repeat() com fr. 18:08 - Próxima Aula: Mão na Massa aplicando repeat() e fr 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 #C28A08