Как правильно объявлять картинку в html/css для 4K?

Question

[Иван Иванов]

Есть картинка 150x50 png.
<img src="/media/images/logo.png">
Если смотреть на 4К в Windows 10 c настройками винды с увеличением 200%, картинка в браузере получается размытой. Есть возможность использовать картинку 300х100. Как лучше поступить? Использовать 300х100 и в коде css объявлять ширину 150 и высоту 50? Чтобы и на обычных мониторах и на таком было нормально. Векторную графику не предлагать использовать)

Answer 1

[imko]

Картинке по-хорошему всегда надо объявлять какой-то размер, хотя бы в процентах, иначе получается стремная зависимость от контента. Для разных экранов можно использовать picture с разными источниками. А на деле эти 300х100 пикселей вместо 150х5 никакой роли не сыграют