怎样在CSS里面实现字体的动感模糊倒影效果和图片雾化效果

html-css010

怎样在CSS里面实现字体的动感模糊倒影效果和图片雾化效果,第1张

你这种情况比较复杂!都是滤镜做的

字体动感模糊窗口--图层,右击字体图层,删格式化文件,滤镜--模糊--动感模糊,选择角度和距离,角度表示你动感模糊的方向,距离越大动感模糊效果越厉害

图片雾化在你原有图层上新建图层保证前景色和背景色为黑白,滤镜--渲染--云彩,将图层模式正常改为滤色即可。。如果觉得雾化太重可以适当降低不透明度

其实毛玻璃的模糊效果技术上比较简单,只是用到了 css 滤镜(filter)中的 blur 属性。

1. 对元素直接使用模糊会将其内容全部模糊掉,为了保证文字不会模糊掉需要多一个层单独应用模糊效果。

2. 模糊效果并不会应用到其背后的元素上,所以需要使用 content 区域有和背景相同的背景图并进行模糊。