CSS滤镜及渐变 (filter样式表属性)

滤镜效果                                         描述  
  -----------------------------------------------------  
        Alpha                                   设置了透明度  
        Blur                                     建立了模糊的效果  
        Chroma                                 把指定的颜色设置为透明  
        Dropshadow                         建立一种偏移的影象轮廓,既投射阴影  
        Filph                                   水平翻转    
        Filpv                                   垂直翻转  
        Glow                                     为对象的外边界增加光效  
        Grayscale                           降低图片的彩度  
        Invert                                 将色彩,饱和度以及亮度值完全翻转建立底片效果  
        Light                                   再一个对象上面进行灯光投影  
        Mask                                     为一个对象建立透明膜  
        Shadow                                 建立一个对象的固体轮廓,即阴影效果  
        Wave                                     在X轴和Y轴方向利用正弦波纹打乱图片  
        Xray                                     只显示对象的轮廓  
   
  -------------------------------------------------------  
  1.Alpha属性  
      语法:filter   :alpha(opacity=opacity,finishopacity=finishopacity,style=style,startX=startX  
                                          startY=startY,finishX=finishX,finishY=finishY)  
       
      功能:它把一个目标元素与背景相混合,即设置图片透明度  
      参数:   opacity   :代表透明水准,默认范围   0---100   0完全透明  
                  finishopacity   :可选,如果想要设置渐变的透明效果,就可以使用它来指定结束时的透明度0-100  
                  style:   指定了透明区域的形状特征  
                                0---代表统一形状  
                                1---代表线形  
                                2---放射形  
                                3---代表长方形  
                  startx   ,starty   :代表渐变透明效果开始的X和Y坐标值  
                  finishX,finishY:代表渐变透明效果结束的X和Y坐标值  
  2.Blur属性  
      语法:   filter:   blur(add=add,direction=direction,strength=strength)  
      功能:   它用于产生模糊效果  
      参数:     add   :   true/fale   ,它指定图片是否被改变成印象派的模糊效果.模糊效果是按顺时针方向进行的.  
                    direction   :   用来设置模糊的方向.   0代表垂直方向.然后每45度一个单位,默认值是向左的270度.  
                                            0--向上     45--右上     90--右   依次类推  
  3.Chroma属性  
      语法:   filter   chroma(color=color)  
      功能:用来设置一个对象中指定的颜色为透明色.color即为要设为透明色的颜色.  
      参数:   #RRGGBB   /#ffff00   两种颜色格式  
  4.Dropshadow属性  
      语法:   filter   dropshadow(color=color,offx=offx,offY=offY,positive=positive)  
      功能:   用于为对象添加阴影效果.    
      参数:   color   :代表投影的颜色  
                  offx,offy:代表X方向和Y方向阴影的偏移量。必用整数来指定。  
                  positive   :     1     true       代表为任何的非透明像素建立可见的阴影  
                                          0     false     代表为透明的像素部分建立可见的投影  
  5.FlipH属性  
      语法:filter:     fliph()  
      功能:它是一个水平翻转对象的滤镜属性。它为当前的对象产生一个滤镜。以此来建立翻转效果。  
  6.FlipV属性  
      语法:filter:     flipv()  
      功能:它是一个垂直翻转对象的滤镜属性。它为当前的对象产生一个滤镜。以此来建立翻转效果。  
  7.Glow属性  
      语法:filter:   glow(color=color,strength=strength)  
      功能:用于使对象的边缘产生类似发光的效果。通过定义数值可以指定这种效果的颜色和力度等级。  
      参数:color   :指定发光的颜色。  
                  strength:   用于指定表现强度。   1---255之间的任何整数。  
  8.Gray属性  
      语法:filter:   gray()  
      功能:把一副图片转换为黑白图。  
      参数:彩色的图片可能含有24位色。也可能含有16位色。当使用此属性时,就可以降低图片的颜色信息。  
  9.Invert属性  
      语法:filter:   invert()  
      功能:可以把对象的可视化属性全部翻转。其中包括色彩,饱和度和亮度值。就是平时所说的‘底片’或是‘页片’效果  
  10.Mask属性  
      语法:filter:   mask(color=color)  
      功能:可以为对象建立一个覆盖的膜。就象带着有色眼镜看物体一样  
  11.Shadow属性  
      语法:filter:   shadow(color=color,direction=direction)  
      功能:可以在指定的方向建立物体的投影  
      参数:color   :投影的颜色                                
                  direction   :设置按照顺时针方向的投影方向。0代表垂直方向。   每45度为一个单位。默认为向左270度  
      Shadow与Dropshadow区别:  
      Shadow   :依靠指定角度值可以任意投射阴影。这些阴影是对象原先部分的延伸。  
      Dropshadow:是依靠X方向和Y方向的偏移量来定义投影的。这些阴影其实是对象的移动。  
  12.Wave属性  
        语法:filter:   wave(add=add,freq=freq,lightstrength=lighstrength,phase=phase,stength=strength)  
        功能:把对象按照垂直的波形样式打乱。  
        参数:add:   表示是否要把对象按照波形样式打乱。默认true  
                    freq:   是波纹的频率,也就是指定在这个对象上面一共需要产生多少完整的波纹  
                    lightstrength:   可以对波纹增强光影的效果。0--100之间的整数值  
                    phase   :用来设置正弦开始的偏移量。通用值为0,0---100之间。这个数值代表开始的偏移量取自波长的百分比  
                                  例如:phase的值为25,那么正弦波就从90度方向开始  
  13.Xray属性   
语法:filter:   xray()   
功能:可以让对象反映出它的轮廓,并把这些轮廓增亮。   
参数:所谓的X光效果都是黑白的灰度图,因此尽管代码中原先定义了其他色。但是经过X光处理后都变成了黑白的反色   
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值