x
<html><head><meta name="viewport" content="width=device-width, initial-scale=1.0"></head><body><h2>Элемент picture</h2><picture> <source media="(min-width: 650px)" srcset="../images/img_food.jpg"> <source media="(min-width: 465px)" srcset="../images/img_car.jpg"> <img src="../images/img_girl.jpg" style="width:auto;"></picture><p>Змініть розмір браузера, щоб побачити різні версії завантаження зображень з різними розмірами області перегляду. Браузер шукає перший елемент джерела, де медіа-запит відповідає ширині поточного вікна перегляду користувача, і витягує зображення, вказане в атрибуті srcset.</p><p>Елемент img потрібен в якості останнього дочірнього тега блоку оголошення зображення. Елемент img використовується для забезпечення зворотної сумісності для браузерів, які не підтримують елемент picture або якщо жоден з вихідних тегів не збігається.</p><p><b>Примітка:</strong> Елемент picture не підтримуються в IE12 і більш ранніх версіях або Safari 9.0 і раніших версіях.</p></body></html>