Задание изображения для плотности пикселей с помощью srcset и размеров

Question

Я пытаюсь справиться с srcset, но у меня возникли проблемы с поиском подробной справки.

Из чего я понимаю, я могу сделать что-то подобное, чтобы указать изображение для мобильного телефона.

<img src="1.jpg" alt="" 
    srcset="1x300.jpg 300w" 
    sizes="(max-width: 480px) 300px"> 

Однако неясно, как я могу указать правильное изображение для плотности отображения.

В приведенном выше примере при ширине экрана менее 480 пикселей я указал, чтобы использовать изображение 300 пикселей. Однако на дисплее 2x сетчатки я хотел бы получить изображение шириной 600 пикселей, но размер экрана будет по-прежнему считаться 480 пикселями.

Как указать другое изображение для другой плотности пикселей?

Answer 1

Базовая структура для тега IMG с SRCSET и РАЗМЕРА,

<img src="images.jpg" srcset="images1x.jpg 200w, images2x.jpg 400w, 
images8x.jpg 600w" sizes="(max-width: 40em) 100vw, 50vw" alt="Some Text"> 

Reference