Estou a trabalhar com a tag picture para usar suas função responsiva e inserindo diversos tamanhos da mesma imagem. No chrome e no Mozilla Firefox os resultados foram perfeitos mas nos celulares e IE11 nao funcionou, esta apenas usando a imagem na tag <img>
segue o codigo.
.foto1{
width: 100%;
vertical-align: middle;
text-align: center;
}
<a id="capa" href="">
<picture>
<source class="foto1" srcset="imagens/capa_peq.jpg" media="(max-width: 480px)">
<source class="foto1" srcset="imagens/capa_normal.jpg" media="(min-width:481px)">
<img class="foto1" src="imagens/capa_normal.jpg" alt="">
</picture>
</a>