Функция 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
,
которое задает стиль для фона