Lista de exercícios | HTML e CSS: trabalhando com responsividade e publicação de projetos

/* Adaptando o corpo do texto para unidades relativas / / Convertendo todos os font-size de px para rem */ body { font-size: 1rem; /* 16px */ } h1 { font-size: 2rem; /* 32px */ } h2 { font-size: 1.75rem; /* 28px */ } h3 { font-size: 1.5rem; /* 24px */ } p { font-size: 1.125rem; /* 18px */ } section { margin: 1.5rem; padding: 1rem; } h1 { font-size: 2rem; margin-bottom: 1rem; } h2 { font-size: 1.5rem; margin-bottom: 0.75rem; } p { font-size: 1rem; line-height: 1.5; } /* Ajustando margens e paddings para diferentes tamanhos de fonte */ header { margin: 2rem; padding: 1.5rem; } footer { margin: 2rem; padding: 1.5rem; } article { margin: 1.5rem; padding: 1rem; } aside { margin: 1rem; padding:

Oi, Thamiris! Como vai?

Obrigada por compartilhar seu código com a comunidade Alura.

Gostei da sua abordagem ao converter os font-sizes para rem, tornando o design mais responsivo. Também é ótimo ver o ajuste de margens e paddings para manter a proporção entre os elementos.

Para saber mais:

Você sabia que o uso de unidades relativas, como rem e em, facilita a responsividade do seu site? Diferente do px, que tem um valor fixo, essas unidades se ajustam dinamicamente ao tamanho da fonte do elemento raiz.

Confira este artigo para entender melhor: MDN Web Docs - Unidades e valores no CSS.

Conte com o apoio da comunidade Alura na sua jornada. Abraços e bons estudos!