Alpha是来设置透明度的。先来看一下它的表达格式:
filter:alpha(opacity=opcity,finishopacity=finishopacity,style=style,startX=startX,startY=startY,finishX=finishX,finishY=finishY)
Opacity代表透明度等级,可选值从0到100,0代表完全透明,100代表完全不透明。Style参数指定了透明区域的形状特征。其中0代表统一形状;1代表直线渐进;2代表圆形渐进;3代表长方形渐进。
Finishopacity是一个可选项,用来设置结束时的透明度,从而达到一种渐变效果,它的值也是从0到100。
StartX和StartY代表渐变透明效果的开始坐标,finishX和finishY代表渐变透明效果的结束坐标。
从上面讲的我们可以看出,如果不设置透明渐变效果,那么只需设置opacity这一个参数就可以了。
请看例子:
1. <div style="width: 350; font-size:15pt; font-family: Arial; color: yellow; position: relative; filter:alpha(opacity=80,style=1)">CSS 滤 镜 教 程</div>
2.<p><img src="frog.jpg" style="filter:alpha(opacity=60,style=2,finishopacity=5)">加Alpha滤镜后的效果</p>
filter:alpha(opacity=opcity,finishopacity=finishopacity,style=style,startX=startX,startY=startY,finishX=finishX,finishY=finishY)
Opacity代表透明度等级,可选值从0到100,0代表完全透明,100代表完全不透明。Style参数指定了透明区域的形状特征。其中0代表统一形状;1代表直线渐进;2代表圆形渐进;3代表长方形渐进。
Finishopacity是一个可选项,用来设置结束时的透明度,从而达到一种渐变效果,它的值也是从0到100。
StartX和StartY代表渐变透明效果的开始坐标,finishX和finishY代表渐变透明效果的结束坐标。
从上面讲的我们可以看出,如果不设置透明渐变效果,那么只需设置opacity这一个参数就可以了。
请看例子:
1. <div style="width: 350; font-size:15pt; font-family: Arial; color: yellow; position: relative; filter:alpha(opacity=80,style=1)">CSS 滤 镜 教 程</div>
CSS 滤 镜 教 程
2.<p><img src="frog.jpg" style="filter:alpha(opacity=60,style=2,finishopacity=5)">加Alpha滤镜后的效果</p>
加Alpha滤镜后的效果