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

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

It reflects the sizes attribute of the <source> element.

Value

A string.

Examples

html
<source id="el" src="mediumVideo.mov" type="video/quicktime" sizes="(50em <= width <= 60px) 50em, (30em <= width < 50em) 30em" /> 
js
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 

Specifications

Specification
HTML
# dom-source-sizes

Browser compatibility

See also