首页 | 短信 | 随身邮 | 网游神 | 聊天 | 论坛 | 新闻 | 体育 | 娱乐 | 搜索
潮流科技> 学园> 网页制作> CSS> 正文
频道搜索
手机短信
频道推荐
·巨酷!支持蓝牙的罗技无线指点光笔(图)
·索尼DSC-U10:数码相机还能怎么小?(图)
·NEC推出超高2048x1536分辨率笔记本(图)
·炫银酷蓝:尼康最新入门机CP2000(图)
·诱人苹果:超低价最新款iBOOK笔记本(图)
·SONY发表超强PEG-T665c掌上电脑(图)
·Sonicblue超高采样率的硬盘MP3播放器(图)
·27日行情:天气让市场冷淡 价格稳中有降
编辑信箱
it@bj.tom.com

CSS滤镜处理图片应用技巧(图)
2001年11月29日来源:赛迪网飞熊

常做网页的朋友们一定都知道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  滤镜  图片  技巧  
进入论坛 推荐好友
相关文章
·极品东芝:掌上电脑率先内置无线网络(图)(7月5日10:35)
·这个暑期电脑市场不清凉 四大热点斗PC(7月5日09:01)
·悬赏20万征天下高手!非要Xbox上跑Linux(7月4日17:56)
·岂能坐以待毙:CTX高端纯平显示器降价(7月4日16:20)
·巨酷!支持蓝牙的罗技无线指点光笔(图)(7月4日11:54)
·用DHCP巧妙分配固定IP地址(图)(7月4日10:56)
·揭示Windows XP的小秘密(7月4日10:38)
·妙用M3U播放Winamp列表文件(图)(7月4日10:09)
TOM是谁   新闻室   投资讯息   刊登广告   私隐政策   TOM招聘
Copyright © 2002 TOM.COM LIMITED. All rights reserved.