设为首页
联系站长
加入收藏

您的位置: 首页>>IT业界>>互联网>>正文
 CSS滤镜应用技巧
 日期:2005-5-24 2:25:57  来源:100down.com

常做网页的朋友们一定都知道CSS吧,CSS是Cascading Style Sheet的缩写,通常人们都叫它“样式表”或“级联样式”。它的功能非常全面,从文字、图片、段落到整个网页各个方面都有它的强大之处,今天我们就来说说CSS中的滤镜效果。

大家在做网页时,对图像处理多数都是用Photoshop等图形处理软件吧,其实在CSS中自带了许多滤镜,合理应用这些滤镜您同样可以做出以上软件所做出的效果。下面我就通过实例来看看CSS中的滤镜应用。

图片雾化

代码:

1、内部插入式

〈head〉〈/head〉之间插入:

〈style type = text/css〉
.fog{filter:alpha(opacity=100,style=2)}
〈/style〉

然后再在图片属性代码中加class="fog"

注意:〈head〉〈/head〉之间插入代码中fog前有一个“.”(不包括引号),请一定不要漏掉了。

2、直接插入式

在图片属性代码中加入:

style=" filter:alpha(opacity=100,style=2)"

效果如图1。


图1

特点:通过使用CSS的“alpha”滤镜,做出图片雾化的效果。

延伸:“style”参数:“0”没有渐进,“1”直线渐进,“2”圆形渐进,“3”矩形渐进;参数“opacity”为不透明的程度百分比。

图片风化

代码:

1、内部插入式

〈head〉〈/head〉之间插入:

〈style type = text/css〉
.wind{filter:Blur(Strength=10)}
〈/style〉

然后再在图片属性代码中加class="wind"(注意“.”号)

2、直接插入式

在图片属性代码中加入:

style=" filter: Blur(Strength=10)"

效果如图2。


图2

特点:通过使用CSS的blur滤镜,使图片具有风吹模糊的效果。

相关文章

·巧用CSS滤镜做图案文字
·用CSS巧控制段落缩进
·用CSS实现特殊的字体效果
·用CSS滤镜实现图片暗室效果
·用CSS实现网页图片半透明
·用CSS滤镜实现图片翻转特效
·巧用CSS制作文字变图象特效
·巧用CSS制作图象特效
·CSS鼠标属性
·CSS分级属性 二


阅读排行

·Win 2000不能访问Win XP的原因及
·解析Windows中的帐户和权限功能
·如何共享Windows XP操作系统
·Windows XP Service Pack 1
·通过 Windows XP 注册表自定义您
·Windows 2000 TCP/IP协议概述
·Windows 2000 Server TCP/IP协议
·dos常用命令使用说明
·Windows变慢原因分析及解决方法(
·Windows变慢原因分析及解决方法(
·WINXP下强行关闭“杀”不了的进程
·Windows XP系统注册表的恢复

最新文档

·创业激情需冷静 网络代理选择应理
·域名交易平台亟需规范 预防域名买
·Travel旅游域名即将引发抢注潮 
·从原理深处分析如何预防arp攻击
·突破建站弊端 企业网络营销大有可
·如何区分进程和病毒?
·java的基础知识,如何学好java
·微机原理与接口技术基础知识
·如何解决青少年沉迷网络的问题,
·全面分析主板BIOS报警信号

请您注意:
·尊重网上道德,遵守中华人民共和国的各项有关法律法规
·您在本站发表的作品,本站有权在网站内转载或引用
·其他网站如果需要转载 本站文章请在贵站著名来源,谢谢合作