Stillborn
@Stillborn
web-developer, web-designer

Как избавиться от сильного размытия изображений при несовпадении размеров и 'background-size: cover'?

Имеется ряд изображений 390px на NNNpx.
На сайте представлены в таком виде:
<style>
.image{
   background-attachment: scroll;
   background-position: center center;
   background-repeat: no-repeat;
   background-size: cover;
   width: 390px;
   height: 545px;
}
</style>
<div class='image' style='background-image:(IMG_DINAMIC_URL_390px_NNNpx)'></div>

Основная масса изображений - 390px на 545px
Имеется ряд изображений с высотой 495px
Изображение центрируется и растягивается - размытие логично
А вот если переделать сие чудо в формат этого меньшего ряда изображений - .image{height: 495px}

То размываются уменьшенные. Причем при уменьшении размытие пропадает только если относительный процент будет кратен делению на 2, т.е. 100%, 50%, 25%, 12,5%…

Есть ли какая-нибудь «фича", которая позволит мне сохранить резкость "на лету" при изменении размера до 88-89%?
  • Вопрос задан
  • 3993 просмотра
Пригласить эксперта
Ответы на вопрос 1
Zoxon
@Zoxon
Веб-разработчик
Размытие по Гауссу
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы