您好,欢迎访问一九零五行业门户网

推荐个Css的filter常用滤波器属性及语句大全_基础教程

css的filter常用滤波器属性及语句大全
语法:style=filter:filtername(fparameter1, fparameter2...) 
(filtername为滤镜的名称,fparameter1、fparameter2等是滤镜的参数)
滤镜说明:
alpha:设置透明层次 
blur:创建高速度移动效果,即模糊效果 
chroma:制作专用颜色透明 
dropshadow:创建对象的固定影子 
fliph:创建水平镜像图片 
flipv:创建垂直镜像图片 
glow:加光辉在附近对象的边外 
gray:把图片灰度化 
invert:反色 
light:创建光源在对象上 
mask:创建透明掩膜在对象上 
shadow:创建偏移固定影子 
wave:波纹效果 
xray:使对象变得像被x光照射一样
1、滤镜:alpha 
语法:style=filter:alpha(opacity=opacity, finishopacity=finishopacity,style=style, startx=startx,starty=starty,finishx=finishx,finishy=finishy)  
说明: 
opacity:起始值,取值为0~100, 0为透明,100为原图。 
finishopacity:目标值。 
style:1或2或3 
startx:任意值 
starty:任意值 
例子:filter:alpha(opacity=0,finishopacity=75,style=2)
2、滤镜:blur 
语法:style=filter:blur(add = add, direction = direction, strength = strength) 
说明: 
add:一般为1,或0。 
direction:角度,0~315度,步长为45度。 
strength:效果增长的数值,一般5即可。 
例子:filter:blur(add=1,direction=45,strength=5)
3、滤镜:chroma 
语法:style=filter:chroma(color = color) 
说明:color:#rrggbb格式,任意。 
例子:filter:chroma(color=#ffffff)
4、滤镜: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)
5、滤镜:fliph 
语法:style=filter:fliph  
例子:filter:fliph
6、滤镜:flipv 
语法:style=filter:flipv 
例子:filter:flipv
7、滤镜:glow 
语法:style=filter:glow(color=color, strength=strength) 
说明: 
color:发光颜色。 
strength:强度(0-100) 
例子:filter:glow(color=#6699cc,strength=5)
8、滤镜:gray 
语法:style=filter:gray 
例子:filter:gray
9、滤镜:invert 
语法:style=filter:invert 
例子:filter:invert
10、滤镜:mask 
语法:style=filter:mask(color=color) 
例子:filter:mask (color=#ffffe0)
11、滤镜:shadow 
语法:filter:shadow(color=color, direction=direction) 
说明: 
color:#rrggbb格式。 
direction:角度,0-315度,步长为45度。 
例子:filter:shadow (color=#6699cc, direction=135)
12、滤镜: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)
13、滤镜:xray 
语法:style=filter:xray  
例子:filter:xray
14.颜色变化
语法:
filter: progid:dximagetransform.microsoft.gradient(gradienttype=0, startcolorstr='#b5ccfa', endcolorstr='#b5ccfa');
其它类似信息

推荐信息