css扩展效果详解.docVIP

CSS 扩展效果详解 可以直接作用于对象上，并且立即生效的滤镜称为基本滤镜。而要配合JavaScript等脚本语言，能产生更多变幻效果的则称为高级滤镜。 alpha（通道） alpha滤镜用于设定透明度，它的表达式如下： filter：alpha（opacity=opcity，finishopacity=finishopacity，style=style，startX=startX，startY=startY，finishX=finishX） 其中opacity表示透明度等级，可选值从0~100，0代表完全透明，100代表完全不透明。style参数制定透明区域形状特征。startX，startY为坐标参数。 blur（模糊） 模糊滤镜给予对象朦胧神秘的效果，它的表达式如下： filter：progid：DXImagetransform.microsoft.blur（makeshadow=makeshadow，pixelradius=pixelradius， shadowopacity=shadowopacity）； 其中makeshadow代表是否处理为阴影，pixelradius表示模糊作用深度，shadowopacity表示阴影的透明度。 Chroma(透明色) chromat滤镜给予图像一个特定的颜色透明，它的表达式如下：filter:Chroma(Color=color) 说明：color：#rrggbb格式，任意。 例子：filter:Chroma(Color=#FFFFFF) DropShadow(投射阴影) 语法：STYLE=filter:DropShadow(Color=color,OffX=offX,OffY=offY,Positive=positive) 说明：Color:#rrggbb格式，任意。 Offx：X轴偏离值。 Offy：Y轴偏离值。 Positive：1或0。 例子：filter:DropShadow(Color=#6699CC,OffX=5,OffY=5,Positive=1) FlipH（水平翻转） 语法：STYLE=filter:FlipH 例子：filter:FlipH FlipV（垂直翻转） 语法：STYLE=filter:FlipV 例子：filter:FlipV glow（外边界光效） 语法：STYLE=filter:Glow(Color=color,Strength=strength) 说明： Color：发光颜色。 Strength：强度(0－100) 例子：filter:Glow(Color=#6699CC,Strength=5) 滤镜：gray 语法：STYLE=filter:Gray 例子：filter:Gray invert（底片效果） 语法：STYLE=filter:Invert 例子：filter:Invert mask（透明膜效果） 语法：STYLE=filter:Mask(Color=color) 例子：filter:Mask(Color=#FFFFE0) shadow（阴影效果） 　语法：filter:Shadow(Color=color,Direction=direction) 说明： Color：#rrggbb格式。 Direction：角度，0－315度，步长为45度。 例子：filter:Shadow(Color=#6699CC,Direction=135) wave（正弦波纹打乱图片效果） 语法：filter:Wave(Add=add，Freq=freq，LightStrength=strength，Phase=phase，Strength=strength) 说明： Add：一般为1，或0。 Freq：变形值。 LightStrength：变形百分比。 Phase：角度变形百分比。 Strength：变形强度。 例子：filter:wave(Add=0,Phase=4,Freq=5,LightStrength=5,Strength=2) Xray（只显示轮廓） 语法：STYLE=filter:Xray 例子：filter:Xray