Atributo srcset do HTML <source>

Definição e uso

srcset A propriedade define a URL da imagem a ser usada em diferentes situações.

Quando o <source> é usado <picture> Neste caso, este atributo é obrigatório.

Exemplo

Um elemento <picture> que contém dois arquivos de origem e uma imagem reserva:

<picture>
  <source media="(min-width:650px)" srcset="img_pink_flowers.jpg">
  <source media="(min-width:465px)" srcset="img_white_flower.jpg">
  <img src="img_orange_flowers.jpg" alt="Flowers" style="width:auto;">
</picture>

Experimente você mesmo

Sintaxe

<source srcset="URL">

Valor do atributo

Valor Descrição
URL

Define a URL da imagem.

Valores possíveis:

  • URL absoluta - aponta para outro site (por exemplo, href="http://www.example.com/flower.jpg")
  • URL relativa - aponta para arquivos dentro do site (por exemplo, href="flower.jpg")

Suporte do navegador

Os números na tabela indicam a versão do navegador que suporta completamente essa propriedade.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
38.0 13.0 38.0 9.1 25.0