1. Главная
2. HTML
3. Тег picture

ТЕГ <PICTURE>

Тег <picture> позволяет внедрять в документ изображение с разными ресурсами, которые выбирает браузер в зависимости от размера экрана.

Поддержка браузеров

Синтаксис

<picture></picture>

Атрибуты

Тег <picture> поддерживает глобальные атрибуты.

Песочница

Код в песочнице можно редактировать и видеть результат в реальном времени:

<picture>
    <source media="(min-width: 700px)" srcset="/images/solar-system.jpg"> 
    <source media="(min-width: 400px)" srcset="/images/solar-system-400.jpg"> 
    <img src="/images/solar-system-200.jpg">
</picture>