Como evitar que as fotos se estiquem/encurtem e percam a proporção quando estamos fazendo a responsividade?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Como evitar que as fotos se estiquem/encurtem e percam a proporção quando estamos fazendo a responsividade?
pra ela estar esticando e encurtando você deve estar colocando o tamanho em porcentagem, coloca em px... e pra fazer uma boa responsividade é bom ter arquivos diferentes da mesma imagem com tamanhos diferentes
<picture>
<source media="(max-width: 600px)" srcset="imagens/dan-droids-pq.png" type="image/png">
<img src="imagens/dan-droids.png" alt="Primeiro mascote do Android">
</picture>nesse exemplo está chamando 2 arquivos diferentes, um pequeno para telas de até 600px na tag source e outro de tamanho maior para telas maiores na tag img
https://jonasnunes.github.io/html-css/exemplos/projeto-android/android.html
confere só nesse link e veja quando a tela atinge 600px a imagem muda
Entendi. Devo usar dois arquivos de imagem sendo chamados em função do tamanho de tela. Tamanho em porcentagem. Muito obrigado Jonas.