Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Dúvida] Tag picture e source.

por André Gonçalves
| 68k xp | 3 posts
Aprendiz

Olá pessoal, queria saber o objetivo da tag picture com imagens em tamanhos diferentes, usando a tag source, tendo em vista que podemos usar medidas relativas no css como %. 

`<picture>
      <source media="(max-width: 750px )" srcset="imagens/foto1.png" type="image/png">
      <source media="(max-width: 1050px )" srcset="imagens/foto2.png" type="image/png">
      <img src="imagens/foto3.png">
 </picture>`
1 resposta
solução!
por Ricardo Martins
| 207.9k xp | 97 posts

Olá André tudo bem? sou aluno e vou tentar ajudar. Acredito que a idéia é em relação ao tamanho da tela, se for uma tela menor a imagem será menor e o que define qual das imagens aparecem seria os breakpoints ou mediaquerys definido na tag source

<source media="(max-width: 750px )"  irá mostrar em resoluções até 750px
source media="(max-width: 1050px )"  irá mostrar em resoluções até 1050px

vo cê pode testar fazendo um resize de seu navegador, ou usando o developer tools (F12 e depois ctrl + shift + m)

espero que te ajude e bons estudos!