HTMLImageElement: srcset property
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Thesrcset property of theHTMLImageElement interface identifies one or moreimage candidate strings, separated using commas (,), each specifying image resources to use under given circumstances. Each image candidate string contains an image URL and an optional width or pixel density descriptor that indicates the conditions under which that candidate should be used instead of the image specified by thesrc property. It reflects the<img> element'ssrcset content attribute.
Thesrcset property, along with thesizes property, are a crucial component in designing responsive websites, as they can be used together to make pages that use appropriate images for the rendering situation.
In this article
Value
A string. For more information about the syntax of thesrcset attribute, see the HTML<img> reference.
Examples
>Setting the srcset attribute
const img = new Image();img.srcset = "/en-US/docs/Web/HTML/Reference/Elements/img/clock-demo-400px.png 2x, /en-US/docs/Web/HTML/Reference/Elements/img/clock-demo-200px.png";img.alt = "An example picture";Specifications
| Specification |
|---|
| HTML> # dom-img-srcset> |