Chegamos ao final do Módulo 11: Fundamentos do CSS Responsivo em que você:
- Compreendeu o conceito de viewport e como ele se relaciona com a visualização de um site em diferentes dispositivos, como celulares, tablets e computadores.
- Dominou o uso de unidades de medidas relativas e absolutas.
- Aplicou propriedades do viewport para criar design responsivo.
- Compreendeu as diferentes categorias de unidades de medida.
- Aplicou porcentagens em CSS.
- Compreendeu o conceito de breakpoints em CSS responsivo para criar regras de estilo que se aplicam a diferentes tamanhos de tela.
- Usou as media queries para definir condições específicas em que as regras de estilo CSS foram aplicadas.
- Criou layouts responsivos usando breakpoints e media queries.
- Compreendeu o conceito de imagens responsivas e por que são importantes para criar uma experiência de usuário consistente em diferentes dispositivos e tamanhos de tela.
- Explorou técnicas de otimização de imagens para garantir que elas fossem carregadas de forma eficiente, minimizando o uso de largura de banda e melhorando o desempenho do site.
- Criou um menu dropdown que funcionou de forma responsiva em diferentes tamanhos de tela e dispositivos.
- Utilizou técnicas de posicionamento CSS para controlar o layout e a aparência do menu dropdown.
- Criou interações de hover e clique para o menu dropdown.
- Compreendeu os princípios fundamentais do CSS Grid, incluindo como criar uma grade de layout, definir linhas e colunas e como os itens foram posicionados dentro dessa grade.
- Aplicou os conceitos do CSS Grid na criação de um layout de página real. Isso incluiu a criação de uma estrutura de grade para a sessão principal do site, bem como a colocação de elementos como imagens e texto dentro dessa grade.
- Criou um layout com CSS Grid e o tornou responsivo, para que funcionasse bem em diferentes tamanhos de tela e dispositivos.
- Compreendeu os princípios do design responsivo.
- Definiu estilos CSS específicos para diferentes tamanhos de tela e dispositivos.
- Implementou um menu responsivo.
