Как сделать - добавить эффекты изображения
Узнайте, как добавлять визуальные эффекты к изображениям.
Фильтры изображений
CSS-фильтры
Свойство CSS filter
добавляет к элементу визуальные эффекты (например, размытие и насыщенность).
Примечание. Свойство filter не поддерживается в Internet Explorer, Edge 12 или Safari 5.1 и более ранних версиях.
Пример оттенков серого
Измените цвет всех изображений на черно-белый (100% серый):
img {
-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
filter: grayscale(100%);
}
Original image
grayscale(100%)
Пример размытия
Примените эффект размытия ко всем изображениям:
img {
-webkit-filter: blur(5px); /* Safari 6.0 - 9.0 */
filter: blur(5px);
}
Original image
blur(5px)
Перейдите к нашему свойству фильтра CSS, чтобы узнать больше о фильтрах CSS.