Curso HTML5 e CSS3.- Módulo 5 de 5 - CSS Grid: Shorthands para Itens - @CursoemVideo HTML5 + CSS3

Simplifique seu código e domine o posicionamento dos itens no CSS Grid! Nesta aula, Gustavo Guanabara apresenta as propriedades shorthand grid-row, grid-column e grid-area, que permitem definir a posição e o tamanho dos elementos com muito menos código. Aprenda também a usar a palavra-chave span para expandir itens por múltiplas linhas ou colunas. Acompanhe a aplicação prática desses conceitos, refatorando um exercício anterior, e prepare-se para um desafio: construir a interface de um site usando tudo o que aprendeu! Assuntos Abordados (Capítulos): 00:00 - Introdução: Simplificando propriedades de itens do grid. 01:53 - Revisão: Propriedades start e end para itens. 02:39 - Foco da Aula: span, grid-row, grid-column e grid-area. 04:40 - Teoria: Como definir áreas com pontos de início e fim. 08:26 - Conceito de Expansão: Usando a palavra-chave span. 10:49 - Simplificação Nível 1: grid-row para unir start e end. 11:47 - Simplificação Nível 1: grid-column para unir start e end. 13:14 - Mão na Massa: Refatorando o código com grid-row e grid-column. 15:55 - Mão na Massa: Aplicando span nas propriedades simplificadas. 17:13 - Simplificação Máxima: A propriedade grid-area. 18:53 - Mão na Massa: Refatorando o código com grid-area. 21:21 - Aplicando span com a propriedade grid-area. 22:07 - Resumo Gráfico: As 3 formas de declarar a posição de um item. 23:41 - DESAFIO: Monte a interface de um site com Grid Layout! 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 #C28A12