Подтвердить что ты не робот

Расплывчатые уменьшенные изображения в Chrome

Я использую гравитары, и это довольно часто, когда я уменьшаю их с помощью css, и я считаю, что Google Chrome раньше делал это должным образом до недавнего времени (возможно, я ошибаюсь, не знаю, когда именно возникла проблема), но теперь изображения становятся размытыми при масштабировании, и это происходит только в Chrome, FF уменьшает масштабирование. Я попытался использовать image-rendering, но это не решило проблему. Может ли кто-нибудь дать мне подсказку, что это лучший способ сделать это?

Здесь можно найти , открыть его в Chrome, а затем в FF, он должен быть более размытым в Chrome, чем в FF.

Спасибо

4b9b3361

Ответ 1

Я нашел ту же самую проблему на Mac: Firefox очень хорошо масштабирует изображение, а хром делает его размытым, что очень плохо. Мне было все равно, что время или скорость рендеринга мне нужно, чтобы логотип выглядел GOOD!

Я нашел, что следующее правило CSS исправляет Chrome для Mac

image-rendering: -webkit-optimize-contrast;

Ответ 2

Я обнаружил, что лучший способ решить эту проблему - просто использовать svg. Другой вариант - использовать запросы css media для загрузки адаптивных размеров изображений.

Ответ 3

Я предлагаю другой трек, потому что я был в той же ситуации: изображения слегка размыты в Chrome, но безупречны в Firefox. Ctrl + "0" решил проблему. Мне пришлось однажды использовать зум (Ctrl + "+" или "-") и не сбросить его полностью...