CSS各种滤镜制作10种艺术效果字
2008-02-23 08:29:22来源：互联网 阅读 ()
如果灵活应用CSS各种滤镜的特点并加以组合，我们可以得到许多意想不到的效果。这是一些效果示范，供各位参考。
效果一：
| www.webjx.com |
这个效果用了shadow滤镜，代码如下：
| filter:shadow(color=black,direction=135) |
效果二：
| www.webjx.com |
用blur滤镜做出的效果，代码如下：
| filter:blur(direction=135,strength=10) |
效果三：
| www.webjx.com |
用dropshadow滤镜做出的效果，代码如下：
| filter:dropshadow(color=#888888,offx=8,offy=8,positive=1) |
效果四：
| www.webjx.com |
用glow滤镜做出的效果，代码如下：
| filter:glow(color=royalblue,strength=5) |
效果五：
| www.webjx.com |
这个效果用到了两种滤镜：shadow和alpha，代码如下：
| filter:alpha(opacity=100,finishiopacity=0,style=1) shadow(color=#ff3366,direction=135) |
效果六：
| www.webjx.com |
这个效果也用到两个滤镜mask和shadow，和本文最顶端的例子一样，只是颜色不同，代码如下：
| filter:mask(color=#f7f7f7) shadow(color=royalblue,direction=135) |
注意：mask的颜色要和网页背景色一致，字体的颜色由shadow决定。
效果七：
| www.webjx.com |
这个效果和效果六类似，效果六中的mask用的是和背景同样的颜色，而本例mask则用的是红色，同样的，字体颜色由shadow决定。代码如下：
| filter:mask(color=red) shadow(color=black,direction=135) |
效果八：
| www.webjx.com |
如果说效果六的字体是阴文的话，那么这个效果的字体应该算是阳文了，用两个滤镜实现mask和dropshadow，注意mask的颜色要和网页背景色一致，或者把mask和chroma成对使用，也可达到同样效果（下面有介绍）。代码如下：
| filter:mask(color=#f7f7f7f) dropshadow(color=royalblue,offx=-3,offy=-3,positive=1) |
效果九：
| www.webjx.com |
这个有光晕的文字用了两个滤镜glow和droshadow，代码如下：
| filter:glow(color=pink,strength=10) dropshadow(color=royalblue,offx=3,offy=3,positive=1) |
效果十：
| www.webjx.com
标签： 版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com 
上一篇：CSS 属性参考资料表 下一篇：CSS的超级技巧大放送
相关文章
IDC资讯： 主机资讯 注册资讯 托管资讯 vps资讯 网站建设 网站运营： 建站经验 策划盈利 搜索优化 网站推广 免费资源 网络编程： Asp.Net编程 Asp编程 Php编程 Xml编程 Access Mssql Mysql 其它 服务器技术： Web服务器 Ftp服务器 Mail服务器 Dns服务器 安全防护 软件技巧： 其它软件 Word Excel Powerpoint Ghost Vista QQ空间 QQ FlashGet 迅雷 网页制作： FrontPages Dreamweaver Javascript css photoshop fireworks Flash 
热门词条
最新资讯
热门关注
热门标签
|