想自学教程的朋友,就来教程巴巴。
教程巴巴
当前位置: 主页 > 图文 > 网页制作教程 >

网页中实现透明度的方法

发布时间:2012-06-07 23:27 点击:
分享到:
【评论本教程】 【挑错本教程】
------分隔线----------------------------

今天有朋友问我,“图层:透明度怎么改,开始以为是PS。后来告诉我是网页,那就用DIV+CSS的代码很容易实行咯。。。普及一下。不知道的看一下吧。

 

filter: alpha(opacity=70); 
opacity: 0.7;

加到CSS文件里就好了。需要哪层加哪层。很好理解~


黑白照片 filter: gray; 
X光照片 filter: Xray; 
风动模糊 filter: blur(add=true,direction=45,strength=30); 
正弦波纹 filter: Wave(Add=0, Freq=60, LightStrength=1, Phase=0, Strength=3); 
半透明效果 filter: Alpha(Opacity=50); 
线型透明 filter: Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=140); 
放射透明 filter: Alpha(Opacity=10, FinishOpacity=100, Style=2, StartX=30, StartY=30, FinishX=200, FinishY=200); 
白色透明 filter: Chroma(Color=#FFFFFF); 
降低色彩 filter: grays; 
底片效果 filter: invert; 
左右翻转 filter: fliph; 
垂直翻转 filter: flipv; 
投影效果 filter:progid:dXImageTransform.Microsoft.DropShadow(color=#cccccc,offX=5,offY=5,positives=true); 
马赛克 filter:progid:dXImageTransform.Microsoft.Pixelate(maxsquare=3); 
发光效果 filter:progid:dXImageTransform.Microsoft.Glow(color=#cccccc,Strength=5); 
柔边效果 filter:alpha(opacity=100, finishOpacity=0,style=2


Opacity:透明度级别,范围是0-100,0代表完全透明,100代表完全不透明。

 
FinishOpacity:设置渐变的透明效果时,用来指定结束时的透明度,范围也是0 到 100。

 
Style:设置渐变透明的样式,值为0代表统一形状、1代表线形、2代表放射状、3代表长方形。

 
StartX和StartY:代表渐变透明效果的开始X和Y坐标。

 
FinishX和FinishY:代表渐变透明效果结束X和Y 的坐标。