HTMLSourceElement: sizes property

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨March 2017⁩.

Thesizes property of theHTMLSourceElement interface is a string representing a list of one or more sizes, representing sizes between breakpoints, to which the resource applies.

It reflects thesizes attribute of the<source> element.

Value

A string.

Examples

html

<picture>  <source       srcset="medium-pic.jpg"    type="image/jpeg"    sizes="(50em <= width <= 60px) 50em,           (30em <= width < 50em) 30em" /></picture>

const el = document.getElementById("el");console.log(el.sizes); // Output: "(50em <= width <= 60px) 50em, (30em <= width < 50em) 30em"el.sizes = "(50em <= width <= 60px) 100em, (30em <= width < 50em) 60em"; // Updates the sizes value