Falta pouco!

0 dias

0 horas

0 min

0 seg

1
resposta

html-css-responsividade-publicacao-projetos - 07 Lista de exercícios

1.Adaptando o corpo do texto para unidades relativas

.apresentacao__conteudo__texto {
    font-size: 1.5rem;
}

2.Convertendo pixels para rem em CSS

.sobre-card h3 {
  font-size: 1.25rem; /* 20 ÷ 16 */
}

3.Melhorando a responsividade de um site
Testei os tamanhos de fonte Muito grande, Grande, Médio, Pequeno e Muito pequeno.
Em todos eles o site se adaptou adequadamente, mantendo boa legibilidade e layout.

4.Ajustando o CSS para diferentes tamanhos de fonte
O site se adaptou. Caso não tivesse poderiamos fazer isto:
Exemplo prático no seu CSS:

.apresentacao__conteudo {
    max-width: 615px;
}

Se em fontes grandes esse bloco ficar muito apertado, você pode aumentar o max-width:

.apresentacao__conteudo {
    max-width: 700px; /* Ajustado */
}

Ou usar clamp no tamanho da fonte para adaptação:

.apresentacao__conteudo__titulo {
    font-size: clamp(1.5rem, 4vw, 2.25rem);
}
1 resposta

Oi, John.

Agradeço por compartilhar.

Muito legal ver como você explorou unidades relativas como rem e também testou diferentes tamanhos de fonte para garantir a legibilidade. A ideia de usar clamp no título é ótima para tornar a tipografia flexível e adaptada a vários dispositivos.

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