1
resposta

Porcentagem e pixel

Boa tarde, qual a diferença entre mexer em um elemento usando porcentagem ou pixel? em um projeto por fora que estou fazendo para treinar usei a porcentagem para ajustar botão e imagem e quando eu dava zoom a página quebrava e os elementos passeavam pela tela, não se adaptando e ficando juntinho, mas quando a orientadora usou porcentagem para definir a posição do body não alterou em nada... gostaria de entender a diferença :c

1 resposta

Olá Anne! Tudo bem?

A diferença entre usar porcentagem e pixel para ajustar elementos em um projeto é que a porcentagem é relativa ao tamanho do elemento pai, enquanto o pixel é uma unidade de medida fixa.

Quando você usou porcentagem para ajustar o botão e a imagem no seu projeto, eles se adaptaram ao tamanho da tela, o que é ótimo para garantir a responsividade do site. No entanto, quando você deu zoom na página, os elementos quebraram e não se adaptaram corretamente. Isso acontece porque a porcentagem é calculada em relação ao tamanho do elemento pai, então quando você dá zoom na página, o tamanho do elemento pai também muda e, consequentemente, o tamanho dos elementos filhos.

Já no caso da instrutora, quando ela usou porcentagem para definir a posição do body, não houve alteração porque o body é o elemento pai de todos os outros elementos da página. Ou seja, quando o tamanho do body muda, todos os elementos filhos também se adaptam automaticamente.

Para evitar que os elementos quebrem quando você dá zoom na página, uma alternativa é usar unidades de medida fixas, como o pixel. Dessa forma, os elementos não se adaptam ao tamanho da tela, mas permanecem com o mesmo tamanho independentemente do zoom.

No entanto, é importante ressaltar que o uso de unidades de medida fixas pode comprometer a responsividade do site, pois os elementos não se adaptarão a diferentes tamanhos de tela. Portanto, é necessário encontrar um equilíbrio entre o uso de porcentagem e pixel, levando em consideração as necessidades do seu projeto.

Espero ter ajudado! Qualquer dúvida estou à disposição.

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!