Атрибут sizes

Атрибут sizes

Задає розміри зображення для різних макетів сторінки. Різні значення та приклади використання показано нижче.

Одне значення ширини. Тут vw — це ширина у выдсотках выд областы перегляду.

sizes="100vw"

Медіазапит із одним значенням ширини. В даному випадку як контрольна точка задано 40em.

sizes="(min-width: 40em) 100vw"

Список розмірів, перерахований через кому. У значеннях можна вказувати медіазапити та функцію calc().

sizes="(max-width: 30em) 100vw, (max-width: 50em) 50vw, calc(33vw - 100px)"

Синтаксис

<picture>
 <source sizes="[<розмір вихідника># ,]? <значенння рохміру вихідника>
 <медіазапит> <значення розміру вихідника>
 <розмір>">
</picture>

<значенння розміру вихідника> не допускає відсотки, використовуйте лише одиниці vw.

Значення за замовчуванням

Немає.

Браузери