DreamweaverMX2004CSS过滤器

　　

　　CSS过滤器有两种，其中一种是静态过滤器，能够使对象产生静态的特别效果；另一种是动态过滤器，用来处理网页或HTML元素对象的显示效果的。

　　【静态过滤器】

　　首先我们来一起做一个实例，为网页中的图像配置模糊效果：

　　1、新建一个网页，网页中插入一个图像：

　　2、选定图像，然后在【文本】/【CSS样式】菜单中选中【新建】命令，打开【CSS面板】

　　【标签】选择“img”

　　【选择器类型】选择“标签”

　　【定义在】选择“仅对该文档”

　　按下确定“确定”按钮后出现样式定义对话框：

　　选则“扩展”分类。【过滤器】中选择如下，并手动修改参数，按下【确定】按钮。保存网页文档，然后在浏览器打开该网页，显示如下效果：

　　【实例分析】

　　在CSS静态过滤器中有14种效果能够被IE4.0浏览器支持，其中是：Alpha渐变半透明效果。 Blur模糊效果（风吹效果） Chroma指定颜色为透明效果（使图像中某种指定的颜色成为透明） DropShadow下落阴影效果（使HTML对象产生下落式阴影效果） Shadow渐进式下落阴影效果。 FlipH水平翻转效果。 FlipV垂直翻转效果。 Glow光晕效果。 Gray灰色调效果。 Invert底片效果。 Light光源投射效果。 Mask色片覆盖效果（遮罩效果） Waver波浪效果。 Xear X光片效果。

　　在上一个实例中，我们使用了模糊效果，其中作用和参数见下表：

参数名称	功能	参数值
Add	是否显示原对象	0＝显示；1＝不显示
Direction	模糊方向	0＝上，45＝右上，90＝右，125＝右下，180＝下，225＝左下，270＝左，315＝左上
Strength	模糊半径，单位像素。	自然数

　　由此可见，过滤器是由参数和参数值组成的，这些参数和值的变化组合，能使对象产生各种效果。其功能并不比PhotoShop软件中的滤镜效果逊色。相反不少图像处理软件进行特别效果处理之后的图片体积会有所增加，而使用过滤器对图片进行处理能保持图片原有的属性，大大加快网页装载速度。

　　过滤器参数属性过多，针对不同的施加对象，各类参数要根据使用者的喜好、需求连同对象本身的属性进行配置调试。具体的使用方法请各位参考相关书籍，在此不一一叙述了。

　　【动态过滤器】

　　在一些动画软件中能制作出翻书效果的GIF动画。使用动态过滤器同样能够制作动态的演示效果，并且网页的打开速度要比使用GIF动画快很多。但是动态过滤器不能像静态过滤器那样直接在HTML中调用，他要结合在Scripts程式中，由Scripts对其加以控制，要想使用动态过滤器则需要掌控Scripts编程。请大家参考其他相关书籍学习掌控。这里只介绍一下动态过滤器能产生的效果：各种形状的大小变换，远近变换； 各种方向的切如切出，淡入淡出； 爆炸效果，百叶窗效果，棋盘效果； 各种随机变换效果等。

标签：

版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点，本站所提供的摄影照片，插画，设计作品，如需使用，请与原作者联系，版权归原作者所有