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



Чат с GPT Компилятор