Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

[Dúvida] Como criar as linhas e colunas de grid colorido

No curso de css grid, o professor não explicou como fazer aquelas linhas coloridas que dividia os grid para projetar o layout.

Alguém poderia me explicar, como criar as linhas na verticais e horizontais?

Quais são os padrões de divisão de colunas e linhas mais comuns? algum modelo para seguir nos projetos futuros?

3 respostas

Olá, tudo bem?

Qual curso de grid você está se referindo? O tópico aberto não está associado a nenhum curso e temos alguns de grid.

Se puder enviar uma imagem dessas linhas que está mencionando, assim consigo te ajudar melhor.

Fico no aguardo para mais informações, abraços!

É o curso de CSS grid https://cursos.alura.com.br/course/css-grid-layout

São essas linhas vermelhas abaixo, que marca a tela, para conseguir projetar o layout do site. Como fazer isso? é quais são os padrões de divisões mais utilizados para criar o layout?

Essas linhas vermelhas no grid

solução!

Olá, tudo bem? Obrigada pelo retorno!

Essa marcação geralmente é feita por uma ferramenta de prototipação chamada figma, ela é bastante utilizadas pelas pessoas da àrea de UX e Design.

Atualmente, existe um padrão nessas divisões da página.

  • 12 colunas para telas grandes (desktop)
  • 8 colunas para telas médias (tablet)
  • 4 colunas para telas pequenas (mobile)

Dessa forma é possível manter uma consistência entre os componentes sem perder a flexibilidade de construção.

Se você estiver interessado em se aprofundar mais no assunto, tem um alura+ que fala especificamente sobre o assunto:

E se quiser dar um mergulho ainda mais profundo, tem esse curso sobre desenvolver sites para diversas telas. Na aula 02, vídeo 02, o professor mostra a construção de um grid no figma.

Espero ter ajudado, em caso de dúvidas fique a vontade para perguntar, abraços!