Функцыя blur

Функцыя blur дазваляе размываць фонавыя выявы па Гаўсе.

Сінтаксіс

cssселектар {
  filter: blur(памер размыцця);
}

Прыклад

Давайце ўсталюем для нашай выявы размыццё ў 2px:

html<div id="elem"></div>
css#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,
    якая задае стыль для фону