Fundamentos de CSS: começando com o sistema de grid CSS
Rachel Andrew, Web Developer, Speaker and Author
Assista a este curso e milhares de outros
Assista a este curso e milhares de outros
Aulas neste curso
-
-
1.
Introdução
1:23
-
2.
Introduzindo o grid CSS
8:17
-
3.
Como definir seu grid
10:33
-
4.
Como dimensionar as faixas
6:23
-
5.
Como aninhar grids e posicionar itens
10:56
-
6.
Como combinar o posicionamento manual e o automático
7:35
-
7.
Como incorporar a resposta
9:23
-
8.
Como combinar os layouts
3:30
-
9.
Considerações finais
0:59
-
10.
Explore mais cursos na Skillshare
0:35
-
-
- --
- Nível iniciante
- Nível intermediário
- Nível avançado
- Todos os níveis
Gerado pela comunidade
O nível é determinado pela opinião da maioria dos estudantes que avaliaram este curso. Mostramos a recomendação do professor até que sejam coletadas as respostas de pelo menos 5 estudantes.
5.478
Estudantes
8
Projetos
Sobre este curso
Quer criar layouts bidimensionais rápidos e flexíveis no CSS? Aprenda como com o grid CSS!
Junte-se à guru da web, instrutora e autora Rachel Andrew para este curso sobre sistemas de grid CSS: o sistema de layout mais poderoso disponível no CSS. Com o sistema de grid CSS, você agora pode definir tanto as linhas quanto as colunas, tornando-o um sistema bidimensional, que abre um novo mundo de possibilidades de layout. Ao longo deste curso, a Rachel explica em detalhes o sistema de grid CSS e mostra as estruturas super responsivas e flexíveis que ele lhe permite implementar nos seus projetos.
Os destaques do curso incluem:
- Como adicionar falhas e bordas com uma única linha de código
- Como aninhar grids para criar sobreposições fáceis
- Como criar imagens hero combinando o posicionamento manual e o posicionamento automático
- Como incorporar a resposta para visualização em qualquer tamanho de tela
Quer você seja iniciante no CSS ou já esteja usando isso desde o princípio, este curso vai lhe mostrar como criar layouts em grande escala, únicos e assimétricos com facilidade e eficiência. Todos os desenvolvedores devem saber sobre o grid CSS e depois disso você estará pronto para implementá-lo no seu próximo projeto.
Conheça seu professor
Rachel Andrew lives in Bristol, England. She is one half of web development company edgeofmyseat.com, the company behind Perch CMS and Notist. Her day to day work can include anything from product development to devops to CSS, and she writes about all of these subjects on her blog at rachelandrew.co.uk.
Rachel has been working on the web since 1996 and writing about the web for almost as long. She is the author or co-author of 22 books including The New CSS Layout, and a regular contributor to a number of publications both on and offline. She is a Google Developer Expert for Web Technologies a W3C Invited Expert to the CSS Working Group, and Editor in Chief of Smashing Magazine. Rachel is a frequent speaker at web development and design events includ... Visualizar o perfil completo
Projeto prático de curso
Faça o upload da sua página de blog!
Se você tem acompanhado no codePen ou tem usado seu próprio editor, adoraríamos ver seu projeto. Fique à vontade para fazer o upload de quaisquer excertos de código ou ideas sobre como você pode começar a usar o grid CSS.
Recursos
- Para mais recursos da Rachel Andrew sobre o grid CSS: grid por exemplo
- Para uma conta gratuita do codePen: skl.sh/codepen
Links de exercícios
- Ponto de partida: skl.sh/cssgrid_1
- Como definir o dimensionamento da faixa : skl.sh/cssgrid_2
- Como aninhar grids e posicionar itens: skl.sh/cssgrid_3
- Como combinar o posicionamento manual e o automático: skl.sh/cssgrid_4
- Como incorporar a resposta: skl.sh/cssgrid_5
- Como combinar os layouts: skl.sh/cssgrid_6
- Página final do blog: skl.sh/cssgrid_final
Encontre a Rachel no seu site, Twittere blog
Explore mais cursos na Skillshare
- O kit de ferramentas de Javascript completo: como programar de forma mais limpa, mais rápida e melhor — Christian Heilmann
- Introdução ao CSS: como adicionar estilos fundamentais a um site de portfólios — Jenn Lukas
- Design inteligente e responsivo de UX: dicas, truques e técnicas inteligentes - Vitaly Friedman
- Programando visualizações de dados: um kit de ferramentas de programação para processamento - Nicholas Felton
Nota do curso
Por que fazer parte da Skillshare?
Faça cursos premiados Skillshare Original
Cada curso possui aulas curtas e projetos práticos
Sua assinatura apoia os professores da Skillshare