HTML <source> srcset Attribute

The HTML <source> tag

Definition and Usage

srcset Specifies the URL of the image to be used in different situations.

The <source> attribute is used for <picture> This attribute is required when

Example

An <picture> element containing two source files and a fallback image:

<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>

Try It Yourself

Syntax

<source srcset="URL">

Attribute Value

Value Description
URL

Specifies the URL of the image.

Possible values:

  • Absolute URL - Points to another website (e.g., href="http://www.example.com/flower.jpg")
  • Relative URL - Points to a file within the website (e.g., href="flower.jpg")

Browser Support

The numbers in the table indicate the first browser version to fully support this property.

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

The HTML <source> tag