Что можно сделать с ухудшением качества картинок при ресайзе страницы?

Question

[Максим Иванов]

Что можно сделать с ухудшением качества картинок при ресайзе страницы? То есть можно ли оптимизировать их, чтобы качество было такое же как и на пк?

Comments

[theuser]

Использовать набор картинок, не?
https://developer.mozilla.org/ru/docs/Learn/HTML/M...

Answer 1

[Владимир Юрченков]

Ресайз в какую сторону? Если в меньшую.
Я использую:

width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;

Comments

[Владимир Юрченков]

Размеры уж подгоняйте сами.

[Ankhena]

Интересно, какое это имеет отношение к качеству...

[Владимир Юрченков]

Ankhena, а каким образом вы сможете сохранить качество картинки ресайзая ее в целом в меньшую\большую сторону? Мое предложение состоит не в ресайзе, а в обходном пути.

[Ankhena]

Владимир Юрченков, ваш обходной путь никак не сказывается на качестве.

а каким образом вы сможете сохранить качество картинки ресайзая ее в целом в меньшую\большую сторону?

Никто не использует для этого одну картинку, а делают несколько под разные размеры окна, ретину, поддержку форматов и складывают их в тег picture. Или частично через img, srcset и sizes.

Answer 2

[polxz]

просто лучше использовать не png, а svg
т.к. png это растровое изображение, svg в свою очередь векторное