Основы работы с XHTML и CSS
Фильтр blur()
Фильтр blur() создает впечатление движения, размывая изображение на определенное число пикселей в определенном направлении. Свойства этого фильтра показаны в таблице 5.5.
| filter:blur() | strength=n direction=n add=true|false |
Свойство strength=n задает число пикселей для размывания: чем больше число, тем больше размывание. Свойство direction=n задает угол размывания в градусах, при этом 0 соответствует направлению вверх, 90 - направлению вправо, 180 - направлению вниз и 270 - направлению влево. Можно использовать промежуточные значения. Свойство add со значением true создает наложение размывания на исходное изображение для создания эффекта размытого движения, а не просто размытого изображения.
Следующий код создает изображение, показанное на рисунке 5.28 Размывание на расстояние 25 пикселей выполняется влево от изображения.
<img src="Osprey.jpg" style="filter:blur(strength=25, direction=270, add=true)"/>
Рис. 5.28. Изображение с фильтром blur()
