CSS滤镜应用技巧(1)

aa 发表于 2010-4-21 9:28:11

图片雾化

代码：

1、内部插入式

在〈head〉与〈/head〉之间插入：
〈style type = text/css〉
.fog{filter:alpha(opacity=100,style=2)}
〈/style〉

然后再在图片属性代码中加class="fog"。

注意：在〈head〉与〈/head〉之间插入代码中fog前有一个HTML“．”（不包括引号），请一定不要漏掉了。

2、直接插入式

在图片属性代码中加入：

style=" filter:alpha(opacity=100,style=2)"

效果如图1。

图1

特点：通过使用CSS的http://www.54361.cn/“alpha”滤镜，做出图片雾化的http://www.54361.cn/效果。

延伸：“style”参数：“0”没有渐进，“1”直线渐进，“2”圆形渐进，“3”矩形渐进；参数“opacity”为不透明的http://www.54361.cn/程度百分比。

图片风化

代码：

1、内部插入式

在〈head〉与〈/head〉之间插入：

〈style type = text/css〉
.wind{filter:Blur(Strength=10)}
〈/style〉

然后再在图片属性代码中加class="wind"(注意“.”号)。

2、直接插入式

在图片属性代码中加入：

style=" filter: Blur(Strength=10)"

效果如图2。

图2

特点：通过使用CSS的http://www.54361.cn/blur滤镜，使图片具有风吹模糊的http://www.54361.cn/效果。