资源描述：
《div+css css滤镜的应用》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。
1、CSS滤镜的应用第八讲CSS滤镜8.1滤镜简介8.2通道Alpha滤镜8.3模糊Blur滤镜8.4运动模糊(MotionBlur)8.5透明色(Chroma)8.6反转变换(Flip)8.7光晕(Glow)8.8灰度(Gray)8.9反色(Invert)8.10遮罩(Mask)8.11阴影(Shadow)8.12X射线(X-ray)8.13浮雕纹理(Emboss和Engrave)8.14波浪(Wave)第八讲CSS滤镜8.1滤镜简介Css滤镜的标识符式“filter”，总体的应用上和其他的css语句相同。cs
2、s滤镜可分为基本滤镜和高级滤镜两种。可以直接作用于对象上，并且立即生效的滤镜称为基本滤镜。而要配合JavaScript等脚本语言，能产生更多变幻效果的则称为高级滤镜。CSS滤镜的标识符是：filter语法：filter：filtername（parameters）进行滤镜之前必须定义filterfiltername是滤镜名，parameters是滤镜参数在CSS样式中，提供了filter（滤镜效果），它可以对文字、图片、表格等确定范围的HTML标记设置滤镜效果8.2Alpha滤镜通道（alpha）Alpha(
3、Opacity=?,FinishOpacity=?,Style=?,StartX=?,StartY=?,FinishX=?,FinishY=?)参数说明Opacity代表透明度等级，可选值0-100，0代表完全透明，100代表完全不透明FinishOpacity可选项，设置结束时的透明度，制作渐变效果，可选值0-100Style指明区域的形状特征，0代表统一形状，1代表线性，2代表圆形放射渐变，3代表矩形反射渐变，当style为2或3时，StartX，StartY就无意义StartX，StartY代表透明效果
4、的开始坐标，坐标值是百分比，取值范围0-100FinishX,FinishY代表透明效果的结束坐标，坐标值是百分比，取值范围0-1008.3Blur滤镜参数说明makeshadow有true和false两个值，用来指定是否有阴影效果pixelradius表示模糊作用深度shadowpacity表示阴影透明度模糊（blur）Blur(makeshadow=？,pixelradius=？,shadowpacity=？);8.4运动模糊(MotionBlur)参数说明Add有true和false两个值，用来指定是否
5、叠加原图片Direction设置模糊的方向，模糊效果按顺时针方向进行。0度代表垂直向上，默认值270度Strength使用整数指定，代表有多少像素的宽度受到模糊影响，默认值5px运动模糊(MotionBlur)Blur(Add=？,Direction=？,Strength=？);其中：参数direction用于设定动态模糊效果的方向，总单位为360°，0代表垂直向上，并以每45°为一个单位，而度数以方向定位时，将如下图所示。8.5透明色(Chroma)透明色（Chroma）Chroma(enablrd=?,C
6、olor=?)参数说明enabled有true和false两个值，用来指定是否应用滤镜Color使某一个特定的颜色透明，此参数就代表它的颜色值8.6反转变换(Flip)FlipH滤镜是设置对象产生水平翻转180°，即左右相反的效果；而FlipV滤镜是设置对象产生垂直翻转180°，即上下颠倒的效果。这两个滤镜的基本语法如下：filter:FlipHfilter:FlipV这两个滤镜没有参数。8.7光晕(Glow)参数说明Color指定发光的颜色Strength指定发光的强度，参数值从1-255光晕（Glow）G
7、low(Color=?,Strength=?)8.8灰度(Gray)灰度（Gray）filter:Gray;8.9反色(Invert)反色（invert）filter:invert;8.10遮罩(Mast)参数说明Color用来指定使用什么颜色作为掩膜，建议用gif图片遮罩（mask）mask(Color=?)8.11阴影(Shadow)参数说明Color设置阴影的颜色offx用来设置阴影在横坐标轴上以对象为基准的偏移量。其值为整数型，正右，负左，默认为5offy用来设置阴影在纵坐标轴上以对象为基准的偏移量。
8、其值为整数型，正下，负上，默认为5positiveTrue为任何非透明像素建立可见投影，false为任何透明像素建立可见投影阴影（shadow）Shadow(enabled=?,Color=?,offX=?,offY=?,positive=?)9.12X-射线X射线（xray）filter:xray;9.13浮雕纹理浮雕纹理(Emboss和Engrave)filter:progid:DXImageT
