2. 使用CSS滤镜制造图片特效。
制作一个网页，在网页中间插入一个美丽的景色图片（使用素材图片），在图片下方放置一段固定的文本作为校园介绍。在网页中做好不同的CSS滤镜类（参考资料中的滤镜设置方法）。在图片和文字的下方安排不同的按钮，通过按钮，对图片和文字实施不的滤镜效果 就是能实现下述的12个滤镜效果
参考资料：
语法：STYLE="filter:filtername(fparameter1, fparameter2...)"
（Filtername为滤镜的名称，fparameter1、fparameter2等是滤镜的参数）
滤镜说明：
alpha：设置透明层次
blur：创建高速度移动效果，即模糊效果
chroma：制作专用颜色透明
DropShadow：创建对象的固定影子
FlipH：创建水平镜像图片
FlipV：创建垂直镜像图片
glow：加光辉在附近对象的边外
gray：把图片灰度化
invert：反色
light：创建光源在对象上
mask：创建透明掩膜在对象上
shadow：创建偏移固定影子
wave：波纹效果
Xray：使对象变得像被x光照射一样1、滤镜：Alpha
语法：STYLE="filter:Alpha(Opacity=opacity, FinishOpacity=finishopacity，Style=style, StartX=startX，StartY=startY，FinishX=finishX，FinishY=finishY)"
说明：
Opacity：起始值，取值为0～100, 0为透明，100为原图。
FinishOpacity：目标值。
Style：1或2或3
StartX：任意值
StartY：任意值
例子：filter:Alpha(Opacity="0",FinishOpacity="75",Style="2")
"Alpha"属性是把一个目标元素与背景混合。设计者可以指定数值来控制混合的程度。这种“与背景混合”通俗地说就是一个元素的透明度。通过指定坐标，可以指定各种不同范围的透明度。
Alpha 滤镜语法 {FILTER：ALPHA(opacity=opacity,finishopacity=finishopacity,
style=style,startx=startx,
starty=starty,finishx=finishx,finishy=finishy)} 参数含义分别如下：
参数 说明
opacity 透明度。默认的范围是从0 到 100，他们其实是百分比的形式。也就是说，0代表完全透明，100代表完全不透明。
finishopacity 是一个可选参数，如果想要设置渐变的透明效果，就可以使用他们来指定结束时的透明度。范围也是0 到 100。
style 指定透明区域的形状特征：
0 代表统一形状
1 代表线形
2 代表放射状
3 代表矩形
startx 渐变透明效果开始处的 X坐标。
starty 渐变透明效果开始处的 Y坐标。
finishx 渐变透明效果结束处的 X坐标。
finishy 渐变透明效果结束处的 Y坐标。 具体效果应用如下：
CSS滤镜实现 代码 效果拷屏
正常图片
＜img src="pic1.jpg"
width="180" height="120"＞
透明度为60
＜img src="pic1.jpg"
style="filter:alpha(opacity=60)"
width="180" height="120"＞
区域透明度设置，从(0,5)到(90,60)
＜img src="pic1.jpg"
style="filter:alpha(
opacity=0, finishopacity=100,
style=1,
startx=0,starty=5,
finishx=90,finishy=60"
width="180" height="120" ＞ 2、滤镜：blur
语法：STYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)"
说明：
Add：一般为1，或0。
Direction：角度，0～315度，步长为45度。
Strength：效果增长的数值，一般5即可。
例子：filter:Blur(Add="1",Direction="45",Strength="5")
3、滤镜：Chroma
语法：STYLE="filter:Chroma(Color = color)"
说明：color：#rrggbb格式，任意。
例子：filter:Chroma(Color="#FFFFFF")
4、滤镜：DropShadow
语法：STYLE="filter:DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)"
说明：Color:#rrggbb格式，任意。
Offx：X轴偏离值。
Offy：Y轴偏离值。
Positive：1或0。
例子：filter:DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1")
DropShadow 滤镜 “DropShaow"，顾名思义就是添加对象的阴影效果。其工作原理是建立一个偏移量，加上色彩。
DropShadow 滤镜语法 {filter:dropshadow
(color=color,offx=ofx,offy=offy,positive=positive)} 参数含义如下：
参数 说明
Color 代表投射阴影的颜色
offx X方向阴影的偏移量
offy Y方向阴影的偏移量
Positive 布尔值
如果为TRUE（非0），就为任何的非透明像素建立可见的投影
如果为FASLE（0），就为透明的像素部分建立透明效果 效果实现：
CSS滤镜实现 代码 效果拷屏
正常图片
图片效果
（这里我们把滤镜代码写在＜td＞里）
＜td style=filter:dropshadow
(color=gray,
offx=5,offy=5.positive=0)＞
＜img src="pic1.jpg"
width="180" height="120"＞＜/td＞ 欢迎光临天极设计在线 文字效果
＜td style=filter:dropshadow
(color=gray,
offx=2,offy=2.positive=0)＞
＜b＞＜font size="+1"＞
欢迎光临天极设计在线
＜/font＞＜/b＞＜/td＞ 5、滤镜：FlipH
语法：STYLE="filter:FlipH"
例子：filter:FlipH
6、滤镜：FlipV
语法：STYLE="filter:FlipV"
例子：filter:FlipV
FlipH, FlipV 滤镜 FlipH 滤镜实现水平反转
FlipH 滤镜语法 {filter:filph} FlipV 滤镜实现垂直反转
FlipV 滤镜语法 {filter:filpv}
图片实现效果如下：
CSS滤镜实现 代码 效果拷屏
正常图片
＜img src="pic1.jpg"
width="180" height="120"＞
垂直翻转
＜img src="pic1.jpg"
style="filter:flipv;"
width="180" height="120"＞
水平翻转
＜img src="pic1.jpg"
style="filter:fliph;"
width="180" height="120"＞
先水平反转，然后垂直反转
＜img src="pic1.jpg"
style="filter:fliph()
flipv()"
width="180" height="120"＞ 7、滤镜：glow
语法：STYLE="filter:Glow(Color=color, Strength=strength)"
说明：
Color：发光颜色。
Strength：强度(0－100)
例子：filter:Glow(Color="#6699CC",Strength="5")
Glow 滤镜
对一个对象使用"glow"属性后，这个对象的边缘就会产生类似发光的效果。
Glow 滤镜语法 {filter:glow(color=color,strength)} 参数含义如下：
参数 说明
Color 指定发光的颜色
STRENGTH 强度，值为1到255之间的任何整数，指定发光色力度和范围。
实例：
CSS滤镜实现 代码 效果拷屏
欢迎光临天极设计在线
＜td
style="filter:glow
(color=#ff0000,strength=2)"＞
＜font size="+1"＞
＜b＞欢迎光临天极设计在线＜/b＞＜/font＞
＜/td＞ 这样的效果可以做标题 ＜td
style=filter:glow
(color=#ffff00,strength=5)＞
＜b＞＜font size="+1"＞
这样的效果可以做标题
＜/b＞＜/font＞
＜/td＞ 8、滤镜：gray
语法：STYLE="filter:Gray"
例子：filter:Gray
9、滤镜：invert
语法：STYLE="filter:Invert"
例子：filter:Invert
10、Light 滤镜
Light 滤镜语法 {filter:light}
这个属性模拟光源的投射效果。一旦为对象定义了“LIGHT"滤镜属性，那么就可以调用它的“方法(Method)"来设置或者改变属性。“LIGHT"可用的方法有：
参数 说明
AddAmbient 加入包围的光源
AddCone 加入锥形光源
AddPoint 加入点光源
Changcolor 改变光的颜色
Changstrength 改变光源的强度
Clear 清除所有的光源
MoveLight 移动光源
我们可以定义光源的虚拟位置，以及通过调整X轴和Y轴的数值来控制光源焦点的位置，还可以调整光源的形式（点光源或者锥形光源）指定光源是否模糊边界、光源的颜色、亮度等属性。如果动态的设置光源，可能会产生一些意想不到的效果。10、滤镜：mask
语法：STYLE="filter:Mask(Color=color)"
例子：filter:Mask (Color="#FFFFE0")
Mask 滤镜
Mask 滤镜语法 {filter:mask(color=color)}
使用"MASK"属性可以为对象建立一个覆盖于表面的膜，其效果就象戴着有色眼镜看物体一样 。原表格拷屏
CSS 滤镜效果实现
欢迎光临天极设计在线效果拷屏
11、滤镜：shadow
语法：filter:Shadow(Color=color, Direction=direction)
说明：
Color：#rrggbb格式。
Direction：角度，0－315度，步长为45度。
例子：filter:Shadow (Color="#6699CC", Direction="135")
12、滤镜：wave
语法：filter: Wave(Add=add，Freq=freq，LightStrength=strength，Phase=phase，Strength=strength)
说明：
Add：一般为1，或0。
Freq：变形值。
LightStrength：变形百分比。
Phase：角度变形百分比。
Strength：变形强度。
例子：filter: wave(Add="0", Phase="4", Freq="5", LightStrength="5", Strength="2")
CSS滤镜实现 代码 效果拷屏
＜img src="pic1.jpg" width="180" height="120" alt="正常图片"＞
＜img src="pic1.jpg"
style="filter:wave(
add=add,freq=2,
lightstrength=30,
phase=50,strength=5)"
width="180" height="120"＞
＜img src="pic1.jpg"
style="filter:wave(
add=add,freq=2,
lightstrength=90,
phase=25,strength=5)"
width="180" height="120"＞ 13、滤镜：Xray
语法：STYLE="filter:Xray"
例子：filter:Xray
Gray ,Invert,Xray 滤镜 使用Gray滤镜可以把一张图片变成灰度图，语法很简单：
Gray 滤镜语法 {filter:gray} 实例：
正常图片 滤镜代码实现 效果拷屏
＜img src="pic1.jpg" style="filter:gray" width="180" height="120"＞________________________________________ 使用Invert滤镜可以把对象的可视化属性全部翻转，包括色彩、饱和度、和亮度值
Invert 滤镜语法 {filter:invert}正常图片 滤镜代码实现 效果拷屏
＜img src="pic1.jpg" style="filter:invert" width="180" height="120"＞________________________________________ 使用Xray滤镜可以让对象反映出它的轮廓并把这些轮廓加亮，类似于所谓的“X”光片。
Xray 滤镜语法 {filter:xray} 效果如下：
正常图片 滤镜代码实现 效果拷屏
＜img src="pic1.jpg" style="filter:xray" width="180" height="120"＞12、Wave属性
Wave属性用来把对象按照垂直的波纹样式打乱。它的表达式如下：
Filter：Wave（Add=True（False），Freq=频率，LightStrength=增强光效，
Phase=偏移量，Strength=强度）
我们看到Wave属性的表达式还是比较复杂的，它一共有五个参数。Add参数有两个参数值：True代表把对象按照波纹样式打乱；False代表不打乱；
Freq参数指生成波纹的频率，也就是指定在对象上共需要产生多少个完整的波纹。 LightStrength参数是为了使生成的波纹增强光的效果。参数值可以从0到100。 Phase参数用来设置正弦波开始的偏移量。这个值的通用值为0，它的可变范围为从0到100。这个值代表开始时的偏移量占波长的百分比。比如该值为25，代表正弦波从90度（360*25%）的方向开始。
说了一大堆，我们还是先看一个实例吧。比如下面这幅图片（点击可放大）：
下面我们对上面这个页面加上Wave效果，代码如下：
<html>
<head>
<title> wave css</title>
<style>//*定义CSS 样式开始*//
<!--
.leaf{position:absolute；top:10；width:300；
filter:wave(add=true,freq=3,lightstrength=100,
phase=45,strength=20)；}
//*设置leaf类的样式，绝对定位，wave属性，产生3个波纹， 光强为100，波纹
从162度（360*45%）开始，振幅为20*//
img{position:absolute;top:110;left:40;
filter:wave(add=true,freq=3,lightstrength=100,
phase=25,strength=5)；}
//*设置IMG的样式，绝对定位，wave属性，产生3个波纹，光强为100，波纹从
90度开始，振幅为5*//
-->
</style>
</head>
<body>
<div class=“wave”>//*定义DIV区域内为Wave类*//
<p style=“font-family：lucida handwriting；
font-size=72pt； font-weight：bold；
color：rgb(189,1,64)；”>Leaf</p>
//*设置字体名称、大小、粗细、颜色*//
</div>
<p><img src=“ss01044.jpg”></p>//*导入图片*//
</body>
</html>
这段代码实现的效果如下图：
如果把Wave的参数随便做一下改动，就会达到多种效果，请看另外一种效果：（如下图）：
其实这种效果只是增大了freq参数的值，减小了Strength、LightStrength的值就可以了。您也可以多试试，改变其他的参数值，还可以达到许多不同的效果来。
本节主要讲述了Wave属性的应用，下一节将向您介绍Xray属性。
就是能实现上述的12个滤镜效果
制作一个网页，在网页中间插入一个美丽的景色图片（使用素材图片），在图片下方放置一段固定的文本作为校园介绍。在网页中做好不同的CSS滤镜类（参考资料中的滤镜设置方法）。在图片和文字的下方安排不同的按钮，通过按钮，对图片和文字实施不的滤镜效果 就是能实现下述的12个滤镜效果
参考资料：
语法：STYLE="filter:filtername(fparameter1, fparameter2...)"
（Filtername为滤镜的名称，fparameter1、fparameter2等是滤镜的参数）
滤镜说明：
alpha：设置透明层次
blur：创建高速度移动效果，即模糊效果
chroma：制作专用颜色透明
DropShadow：创建对象的固定影子
FlipH：创建水平镜像图片
FlipV：创建垂直镜像图片
glow：加光辉在附近对象的边外
gray：把图片灰度化
invert：反色
light：创建光源在对象上
mask：创建透明掩膜在对象上
shadow：创建偏移固定影子
wave：波纹效果
Xray：使对象变得像被x光照射一样1、滤镜：Alpha
语法：STYLE="filter:Alpha(Opacity=opacity, FinishOpacity=finishopacity，Style=style, StartX=startX，StartY=startY，FinishX=finishX，FinishY=finishY)"
说明：
Opacity：起始值，取值为0～100, 0为透明，100为原图。
FinishOpacity：目标值。
Style：1或2或3
StartX：任意值
StartY：任意值
例子：filter:Alpha(Opacity="0",FinishOpacity="75",Style="2")
"Alpha"属性是把一个目标元素与背景混合。设计者可以指定数值来控制混合的程度。这种“与背景混合”通俗地说就是一个元素的透明度。通过指定坐标，可以指定各种不同范围的透明度。
Alpha 滤镜语法 {FILTER：ALPHA(opacity=opacity,finishopacity=finishopacity,
style=style,startx=startx,
starty=starty,finishx=finishx,finishy=finishy)} 参数含义分别如下：
参数 说明
opacity 透明度。默认的范围是从0 到 100，他们其实是百分比的形式。也就是说，0代表完全透明，100代表完全不透明。
finishopacity 是一个可选参数，如果想要设置渐变的透明效果，就可以使用他们来指定结束时的透明度。范围也是0 到 100。
style 指定透明区域的形状特征：
0 代表统一形状
1 代表线形
2 代表放射状
3 代表矩形
startx 渐变透明效果开始处的 X坐标。
starty 渐变透明效果开始处的 Y坐标。
finishx 渐变透明效果结束处的 X坐标。
finishy 渐变透明效果结束处的 Y坐标。 具体效果应用如下：
CSS滤镜实现 代码 效果拷屏
正常图片
＜img src="pic1.jpg"
width="180" height="120"＞
透明度为60
＜img src="pic1.jpg"
style="filter:alpha(opacity=60)"
width="180" height="120"＞
区域透明度设置，从(0,5)到(90,60)
＜img src="pic1.jpg"
style="filter:alpha(
opacity=0, finishopacity=100,
style=1,
startx=0,starty=5,
finishx=90,finishy=60"
width="180" height="120" ＞ 2、滤镜：blur
语法：STYLE="filter:Blur(Add = add, Direction = direction, Strength = strength)"
说明：
Add：一般为1，或0。
Direction：角度，0～315度，步长为45度。
Strength：效果增长的数值，一般5即可。
例子：filter:Blur(Add="1",Direction="45",Strength="5")
3、滤镜：Chroma
语法：STYLE="filter:Chroma(Color = color)"
说明：color：#rrggbb格式，任意。
例子：filter:Chroma(Color="#FFFFFF")
4、滤镜：DropShadow
语法：STYLE="filter:DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)"
说明：Color:#rrggbb格式，任意。
Offx：X轴偏离值。
Offy：Y轴偏离值。
Positive：1或0。
例子：filter:DropShadow(Color="#6699CC",OffX="5",OffY="5",Positive="1")
DropShadow 滤镜 “DropShaow"，顾名思义就是添加对象的阴影效果。其工作原理是建立一个偏移量，加上色彩。
DropShadow 滤镜语法 {filter:dropshadow
(color=color,offx=ofx,offy=offy,positive=positive)} 参数含义如下：
参数 说明
Color 代表投射阴影的颜色
offx X方向阴影的偏移量
offy Y方向阴影的偏移量
Positive 布尔值
如果为TRUE（非0），就为任何的非透明像素建立可见的投影
如果为FASLE（0），就为透明的像素部分建立透明效果 效果实现：
CSS滤镜实现 代码 效果拷屏
正常图片
图片效果
（这里我们把滤镜代码写在＜td＞里）
＜td style=filter:dropshadow
(color=gray,
offx=5,offy=5.positive=0)＞
＜img src="pic1.jpg"
width="180" height="120"＞＜/td＞ 欢迎光临天极设计在线 文字效果
＜td style=filter:dropshadow
(color=gray,
offx=2,offy=2.positive=0)＞
＜b＞＜font size="+1"＞
欢迎光临天极设计在线
＜/font＞＜/b＞＜/td＞ 5、滤镜：FlipH
语法：STYLE="filter:FlipH"
例子：filter:FlipH
6、滤镜：FlipV
语法：STYLE="filter:FlipV"
例子：filter:FlipV
FlipH, FlipV 滤镜 FlipH 滤镜实现水平反转
FlipH 滤镜语法 {filter:filph} FlipV 滤镜实现垂直反转
FlipV 滤镜语法 {filter:filpv}
图片实现效果如下：
CSS滤镜实现 代码 效果拷屏
正常图片
＜img src="pic1.jpg"
width="180" height="120"＞
垂直翻转
＜img src="pic1.jpg"
style="filter:flipv;"
width="180" height="120"＞
水平翻转
＜img src="pic1.jpg"
style="filter:fliph;"
width="180" height="120"＞
先水平反转，然后垂直反转
＜img src="pic1.jpg"
style="filter:fliph()
flipv()"
width="180" height="120"＞ 7、滤镜：glow
语法：STYLE="filter:Glow(Color=color, Strength=strength)"
说明：
Color：发光颜色。
Strength：强度(0－100)
例子：filter:Glow(Color="#6699CC",Strength="5")
Glow 滤镜
对一个对象使用"glow"属性后，这个对象的边缘就会产生类似发光的效果。
Glow 滤镜语法 {filter:glow(color=color,strength)} 参数含义如下：
参数 说明
Color 指定发光的颜色
STRENGTH 强度，值为1到255之间的任何整数，指定发光色力度和范围。
实例：
CSS滤镜实现 代码 效果拷屏
欢迎光临天极设计在线
＜td
style="filter:glow
(color=#ff0000,strength=2)"＞
＜font size="+1"＞
＜b＞欢迎光临天极设计在线＜/b＞＜/font＞
＜/td＞ 这样的效果可以做标题 ＜td
style=filter:glow
(color=#ffff00,strength=5)＞
＜b＞＜font size="+1"＞
这样的效果可以做标题
＜/b＞＜/font＞
＜/td＞ 8、滤镜：gray
语法：STYLE="filter:Gray"
例子：filter:Gray
9、滤镜：invert
语法：STYLE="filter:Invert"
例子：filter:Invert
10、Light 滤镜
Light 滤镜语法 {filter:light}
这个属性模拟光源的投射效果。一旦为对象定义了“LIGHT"滤镜属性，那么就可以调用它的“方法(Method)"来设置或者改变属性。“LIGHT"可用的方法有：
参数 说明
AddAmbient 加入包围的光源
AddCone 加入锥形光源
AddPoint 加入点光源
Changcolor 改变光的颜色
Changstrength 改变光源的强度
Clear 清除所有的光源
MoveLight 移动光源
我们可以定义光源的虚拟位置，以及通过调整X轴和Y轴的数值来控制光源焦点的位置，还可以调整光源的形式（点光源或者锥形光源）指定光源是否模糊边界、光源的颜色、亮度等属性。如果动态的设置光源，可能会产生一些意想不到的效果。10、滤镜：mask
语法：STYLE="filter:Mask(Color=color)"
例子：filter:Mask (Color="#FFFFE0")
Mask 滤镜
Mask 滤镜语法 {filter:mask(color=color)}
使用"MASK"属性可以为对象建立一个覆盖于表面的膜，其效果就象戴着有色眼镜看物体一样 。原表格拷屏
CSS 滤镜效果实现
欢迎光临天极设计在线效果拷屏
11、滤镜：shadow
语法：filter:Shadow(Color=color, Direction=direction)
说明：
Color：#rrggbb格式。
Direction：角度，0－315度，步长为45度。
例子：filter:Shadow (Color="#6699CC", Direction="135")
12、滤镜：wave
语法：filter: Wave(Add=add，Freq=freq，LightStrength=strength，Phase=phase，Strength=strength)
说明：
Add：一般为1，或0。
Freq：变形值。
LightStrength：变形百分比。
Phase：角度变形百分比。
Strength：变形强度。
例子：filter: wave(Add="0", Phase="4", Freq="5", LightStrength="5", Strength="2")
CSS滤镜实现 代码 效果拷屏
＜img src="pic1.jpg" width="180" height="120" alt="正常图片"＞
＜img src="pic1.jpg"
style="filter:wave(
add=add,freq=2,
lightstrength=30,
phase=50,strength=5)"
width="180" height="120"＞
＜img src="pic1.jpg"
style="filter:wave(
add=add,freq=2,
lightstrength=90,
phase=25,strength=5)"
width="180" height="120"＞ 13、滤镜：Xray
语法：STYLE="filter:Xray"
例子：filter:Xray
Gray ,Invert,Xray 滤镜 使用Gray滤镜可以把一张图片变成灰度图，语法很简单：
Gray 滤镜语法 {filter:gray} 实例：
正常图片 滤镜代码实现 效果拷屏
＜img src="pic1.jpg" style="filter:gray" width="180" height="120"＞________________________________________ 使用Invert滤镜可以把对象的可视化属性全部翻转，包括色彩、饱和度、和亮度值
Invert 滤镜语法 {filter:invert}正常图片 滤镜代码实现 效果拷屏
＜img src="pic1.jpg" style="filter:invert" width="180" height="120"＞________________________________________ 使用Xray滤镜可以让对象反映出它的轮廓并把这些轮廓加亮，类似于所谓的“X”光片。
Xray 滤镜语法 {filter:xray} 效果如下：
正常图片 滤镜代码实现 效果拷屏
＜img src="pic1.jpg" style="filter:xray" width="180" height="120"＞12、Wave属性
Wave属性用来把对象按照垂直的波纹样式打乱。它的表达式如下：
Filter：Wave（Add=True（False），Freq=频率，LightStrength=增强光效，
Phase=偏移量，Strength=强度）
我们看到Wave属性的表达式还是比较复杂的，它一共有五个参数。Add参数有两个参数值：True代表把对象按照波纹样式打乱；False代表不打乱；
Freq参数指生成波纹的频率，也就是指定在对象上共需要产生多少个完整的波纹。 LightStrength参数是为了使生成的波纹增强光的效果。参数值可以从0到100。 Phase参数用来设置正弦波开始的偏移量。这个值的通用值为0，它的可变范围为从0到100。这个值代表开始时的偏移量占波长的百分比。比如该值为25，代表正弦波从90度（360*25%）的方向开始。
说了一大堆，我们还是先看一个实例吧。比如下面这幅图片（点击可放大）：
下面我们对上面这个页面加上Wave效果，代码如下：
<html>
<head>
<title> wave css</title>
<style>//*定义CSS 样式开始*//
<!--
.leaf{position:absolute；top:10；width:300；
filter:wave(add=true,freq=3,lightstrength=100,
phase=45,strength=20)；}
//*设置leaf类的样式，绝对定位，wave属性，产生3个波纹， 光强为100，波纹
从162度（360*45%）开始，振幅为20*//
img{position:absolute;top:110;left:40;
filter:wave(add=true,freq=3,lightstrength=100,
phase=25,strength=5)；}
//*设置IMG的样式，绝对定位，wave属性，产生3个波纹，光强为100，波纹从
90度开始，振幅为5*//
-->
</style>
</head>
<body>
<div class=“wave”>//*定义DIV区域内为Wave类*//
<p style=“font-family：lucida handwriting；
font-size=72pt； font-weight：bold；
color：rgb(189,1,64)；”>Leaf</p>
//*设置字体名称、大小、粗细、颜色*//
</div>
<p><img src=“ss01044.jpg”></p>//*导入图片*//
</body>
</html>
这段代码实现的效果如下图：
如果把Wave的参数随便做一下改动，就会达到多种效果，请看另外一种效果：（如下图）：
其实这种效果只是增大了freq参数的值，减小了Strength、LightStrength的值就可以了。您也可以多试试，改变其他的参数值，还可以达到许多不同的效果来。
本节主要讲述了Wave属性的应用，下一节将向您介绍Xray属性。
就是能实现上述的12个滤镜效果
解决方案 »
免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货