Функция blur
Функцията blur позволява да размазвате
фонови изображения по Гаус.
Синтаксис
селектор {
filter: blur(размер на размазване);
}
Пример
Нека зададем на нашето изображение размазване
от 2px:
<div id="elem"></div>
#elem {
filter: blur(2px);
background-blend-mode: normal;
background: url("bg.png") center / cover no-repeat,
linear-gradient(#00A8DE, #FFF) fixed;
width: 400px;
height: 300px;
border: 1px solid black;
}
:
Вижте също
-
функцията
brightness,
която задава яркост на фона -
функцията
contrast,
която задава контраст на фона -
функцията
drop-shadow,
която задава сянка на фона -
функцията
hue-rotate,
която задава цветова тоналност на фона -
функцията
invert,
която инвертира цветовете на фона -
функцията
opacity,
която задава прозрачност на фона -
функцията
sepia,
която преобразува фона в сепия -
свойството
background,
което е съкратено свойство за фон -
свойството
background-image,
с което може да зададете фонова картинка на блок -
свойството
filter,
което задава стил за фона