Как сделать блюр (blur) в css?

Пользователь

от gage , в категории: HTML/CSS , 6 месяцев назад

Как сделать блюр (blur) в css?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от violette_robel , 6 месяцев назад

@gage 

Для создания эффекта размытия (blur) в CSS можно использовать свойство filter с функцией blur. Например, чтобы применить размытие к изображению, можно использовать следующий код:

1
2
3
.blur {
  filter: blur(5px);
}


В данном примере, значение 5px указывает на радиус размытия. Чем больше значение, тем больше будет эффект размытия.


Также можно применить размытие к другим элементам, например, к тексту:

1
2
3
.blur {
  filter: blur(2px);
}


В данном примере, текст будет размыт на 2 пикселя.


Кроме функции blur, существуют и другие функции для создания различных эффектов размытия в CSS, такие как -webkit-filter и -moz-filter, но они не поддерживаются всеми браузерами, поэтому рекомендуется использовать только filter.