Como adicionar uma imagem responsiva no cabeçalho? Estou utilizando o tema Flat Bootstrap.
Solucionado
Como adicionar uma imagem responsiva no cabeçalho? Estou utilizando o tema Flat Bootstrap.
hoje, com a Alura e o Google Gemini
Depende.
Estilizando com 'width: 100%' ela vai acompanhar a largura, mas vai ficar achatada na altura e eventualmente prejudicada em termos de visibilidade. Além de que, se a mesma imagem for carregada pra diferentes resoluções, pode haver um desperdício de recurso, fazendo um celular carregar uma imagem p/ desktop.
Usando "picture" tu consegue ter imagens diferentes pra cada resolução, e usando o atributo 'srcset' tu consegue carregar diferentes versões da mesma imagem, conforme a resolução que tu especifica.
Tem uma boa explicação nesse ppt: https://www.slideshare.net/caelumdev/tudo-que-voc-precisa-saber-sobre-ltpicture-e-srcset
Vou estudar esse material e tentar aplicá-la.
Obrigado!