CSS 滤镜——Shadow滤镜

ado|css|滤镜

Shadow 滤镜
语法 {filter:shadow(color=color,direction=direction)}

  利用“Shadow”属性可以在指定的方向建立物体的投影,COLOR是投影色,DIRECTION是设置投影的方向。其中0度代表垂直向上,然后每45度为一个单位。它的默认值是向左的270度。

  效果如下:

CSS滤镜实现 代码 效果拷屏
欢迎光临 <td
style=filter:shadow
(color=red, direction=45>
<b>欢迎光临</b></td> 
天极 <td
style=filter:shadow
(color=blue,direction=180>
<b>天极</b></td>
设计在线 <td
style=filter:shadow
(color=gray, direction=225>
<b>设计在线</b></td>

时间: 2024-08-22 15:18:44

CSS 滤镜——Shadow滤镜的相关文章

CSS滤镜:Shadow属性

ado|css|滤镜 Shadow属性可以在指定的方向建立物体的投影.它的表达式是这样的: Filter:Shadow(Color=color,Direction=direction) 在这里,Shadow有两个参数值:Color参数用来指定投影的颜色:Direction参数用来指定投影的方向. 这里说的方向与我们在第二节Blur属性中提到的"方向与角度的关系"是一样的. 也许您会问,前面讲到的Dropshadow属性和Shadow属性有什么不同吗? 光说的话,您恐怕还难以理解,让我们

用CSS制作Alpha滤镜测试板

css|滤镜     alpha滤镜给我们制作网页特效提供了较大的创作空间,但由于它控制参数较多,在实际应用时,为了确定一组合适的参数值,不得不反复调整修改,在编辑窗口和预览窗口来回倒腾,甚是麻烦.我在这里给你介绍一种方法--    alpha滤镜给我们制作网页特效提供了较大的创作空间,但由于它控制参数较多,在实际应用时,为了确定一组合适的参数值,不得不反复调整修改,在编辑窗口和预览窗口来回倒腾,甚是麻烦.我在这里给你介绍一种方法,制作一个"Alpha滤镜参数测试板",在测试板上输入参

CSS 滤镜——DropShadow 滤镜

ado|css|滤镜 DropShadow 滤镜 "DropShaow",顾名思义就是添加对象的阴影效果.其工作原理是建立一个偏移量,加上色彩. DropShadow 滤镜语法 {filter:dropshadow(color=color,offx=ofx,offy=offy,positive=positive)} 参数含义如下: 参数  说明 Color 代表投射阴影的颜色 offx X方向阴影的偏移量 offy Y方向阴影的偏移量 Positive 布尔值如果为TRUE(非0),就

CSS 滤镜——Alpha 滤镜

css|滤镜   Alpha 滤镜 "Alpha"属性是把一个目标元素与背景混合.设计者可以指定数值来控制混合的程度.这种"与背景混合"通俗地说就是一个元素的透明度.通过指定坐标,可以指定各种不同范围的透明度.         Alpha 滤镜语法 {FILTER:ALPHA(opacity=opacity,finishopacity=finishopacity,style=style,startx=startx,starty=starty,finishx=fini

CSS 滤镜——Wave 滤镜

css|滤镜 Wave 滤镜语法 {filter:wave(add=add,freq=freq,lightstrength=strength,phase=phase,strength=strength)} 参数  说明 wave 把对象按垂直的波形样式打乱.默认是 TRUE(非0) ADD 是否要把对象按照波形样式打乱 FREQ 波纹的频率,也就是指定在对象上一共需要产生多少个完整的波纹 LIGHTSTRENGTH 可以对于波纹增强光影的效果,范围0----100 PHASE 设置正弦波的偏移量

CSS DIV Shadow

/* 2011-11-28 塗聚文 締友計算機信息技術有限公司 CSS DIV Shadow css3 */ #geovinduDiv-shadow { padding:10px; background-color:#f9f9f9; border:1px solid #fff; position:relative; /*Firefox*/ -moz-box-shadow: 3px 3px 4px #000; /*Safari,Chrome*/ -webkit-box-shadow: 3px 3p

CSS 滤镜——Glow 滤镜

css|滤镜 对一个对象使用"glow"属性后,这个对象的边缘就会产生类似发光的效果. Glow 滤镜语法 {filter:glow(color=color,strength)} 参数含义如下: 参数  说明 Color 指定发光的颜色 STRENGTH 强度,值为1到255之间的任何整数,指定发光色力度和范围. 实例: CSS滤镜实现 代码 效果拷屏 欢迎光临天极设计在线   <td style="filter:glow(color=#ff0000,strength=

css中filter 滤镜详解

语法:STYLE="filter:filtername(fparameter1, fparameter2-)"  (Filtername为滤镜的名称,fparameter1.fparameter2等是滤镜的参数)   滤镜说明: Alpha:设置透明层次  blur:创建高速度移动效果,即模糊效果 Chroma:制作专用颜色透明 DropShadow:创建对象的固定影子 FlipH:创建水平镜像图片 FlipV:创建垂直镜像图片 glow:加光辉在附近对象的边外 gray:把图片灰度化

巧用CSS的MASK滤镜_基础教程

Mask滤镜可以为网页上的HTML元件对象作出一个矩形遮罩,关于什么是遮罩?如果你用过Flash中的遮罩,你就会知道了,就是那个样子了.实际上对于遮罩你也可以这样来理解,相当于用一块有色布把物件盖起来,但内容却被挖去了.若你还不明白,就看下面的图片再听我给你细说. 图1 mask滤镜效果1 在上面这mask滤镜中用这么深的颜色,主要是让你能清楚地看出效果来.让我们来看一下mask滤镜的参数: 它只有一个参数Color,即遮罩的颜色 以#RRGGBB 格式的颜色值. 你只要在DW3中给它选择一种适