HTMLLinkElement : propriété imageSizes

Baseline 2023

Newly available

Since ⁨December 2023⁩, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

La propriété imageSizes de l'interface HTMLLinkElement indique la taille et les conditions pour les images préchargées définies par la propriété imageSrcset. Elle reflète la valeur de l'attribut imagesizes de l'élément HTML <link>. Cette propriété permet d'obtenir ou de définir la valeur de l'attribut imagesizes.

L'attribut imagesizes de l'élément <link> est identique à l'attribut sizes de l'élément <img> : une liste de tailles sources séparées par des virgules. Chaque taille source inclut une condition média, la taille de l'image en tant que <length>, ou le mot-clé auto, qui doit apparaître en premier. Pour plus d'informations sur la syntaxe de l'attribut sizes, voir <img>.

Les attributs imagesrcset et imagesizes ne sont pertinents que sur les éléments <link> qui possèdent à la fois un attribut rel défini sur preload et un attribut as défini sur image.

Valeur

Une chaîne de caractères composée de tailles sources séparées par des virgules, ou la chaîne de caractères vide "" si non spécifiée.

Exemples

Given the following <link> element:

html

<link
  rel="preload"
  as="image"
  imagesrcset="narrow.png, medium.png 600w, wide.png 1200w"
  imagesizes="(width < 400px) 200px, (400px <= width < 600px) 75vw, 50vw" />

<pre id="log"></pre>

#log {
  padding: 0 0.25rem;
  font-size: 1.2em;
  line-height: 1.4;
}

const logElement = document.querySelector("#log");
function log(text) {
  logElement.innerText = `${logElement.innerText}${text}\n`;
  logElement.scrollTop = logElement.scrollHeight;
}

…on peut obtenir et modifier la valeur de l'attribut imagesizes avec la propriété imageSizes :

const link = document.querySelector("link");
log(`Original: ${link.imageSizes}`);

// Changer la valeur
link.imageSizes = "50vw";
log(`Mis à jour : ${link.imageSizes}`);

Spécifications

Specification
HTML # dom-link-imagesizes

Compatibilité des navigateurs

Voir aussi

La propriété HTMLLinkElement.imageSrcset
La propriété HTMLImageElement.sizes
Les Requêtes média
Utiliser les attributs srcset et sizes

Help improve MDN

Learn how to contribute

This page was last modified on ⁨7 oct. 2025⁩ by MDN contributors.

View this page on GitHub • Report a problem with this content