第21章 滤镜特效的应用

《第21章 滤镜特效的应用》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、本书编委会编著实例版第21章滤镜特效的应用21.1设置透明度——alpha21.2添加模糊效果——blur21.3设置水平/垂直翻转——fliph/flipv21.4设置灰度——21.5设置反转——21.6设置X射线效果——xray21.7设置波浪效果——wave21.8设置阴影——dropshadow21.9设置边缘光晕效果——glow21.10设置遮罩——mask21.11设置渐变阴影——shadow21.12设定颜色透明——chroma21.13小实例——滤镜的综合应用HTML/CSS/JavaScript标准教程实例版（第2版）第21章滤

2、镜特效的应用基本语法filter:滤镜属性（参数1，参数2，……）第21章滤镜特效的应用语法说明filter是滤镜属性选择符。滤镜属性包含有好多种，本章主要介绍的如表21-1。参数值就是属性值，用来反映属性效果的，具体各个滤镜属性的参数值将在后面详细介绍。第21章滤镜特效的应用表21-1滤镜属性表21.1设置透明度——alpha基本语法filter:alpha(opacity=opacity，finishopacity=finishopacity，style=style，startx=startx，starty=starty，finishx=finishx，finis

3、hy=finishy)21.1设置透明度——alpha语法说明——alpha属性包含的参数说明21.1设置透明度——alpha实例代码21.1设置透明度——alpha接上页21.1设置透明度——alpha接上页21.1设置透明度——alpha网页效果21.1设置透明度——alpha提示在运行含有滤镜属性的代码时，浏览器会出现一个信息栏提示您InternetExplorer阻止了一些不安全的内容。这时您只要单击信息栏的“确定”按钮，然后再右键单击靠近浏览器顶端的信息，从快捷菜单选择“允许阻止的内容”即可看到滤镜的效果。21.2添加模糊效果——blur基本语法filter：bl

4、ur（add=add，direction=direction，strength=strength）21.2添加模糊效果——blur语法说明blue属性包含的参数说明见表21-3。动态模糊的方向是以45°为一个单位，所以如果设置的方向度数不是45的倍数的话，浏览器就会以其最接近的45倍数来设置模糊度数。如，设置了direction=160，实际浏览器是以180°来显示模糊方向的。21.2添加模糊效果——blur表21-3blue滤镜参数说明21.2添加模糊效果——blur实例代码21.2添加模糊效果——blur接上页21.2添加模糊效果——blur网页效果21.3设置水平

5、/垂直翻转——fliph/flipv基本语法filter：fliphfilter：flipv21.3设置水平/垂直翻转——fliph/flipv语法说明fliph和flipv两个属性都没有参数，可以直接引用。21.3设置水平/垂直翻转——fliph/flipv实例代码21.3设置水平/垂直翻转——fliph/flipv接上页21.3设置水平/垂直翻转——fliph/flipv网页效果21.3设置水平/垂直翻转——fliph/flipv提示在实际应用过程中，水平翻转和垂直翻转滤镜属性也可以同时使用。其语法为：filter：fliphflipv;两个属性中间用空格隔开，代表水

6、平垂直翻转。21.4设置灰度——基本语法filter：gray21.4设置灰度——实例代码21.4设置灰度——接上页21.4设置灰度——网页效果21.6设置X射线效果——xray基本语法filter：xray21.6设置X射线效果——xray实例代码21.6设置X射线效果——xray接上页21.6设置X射线效果——xray网页效果21.6设置X射线效果——xray实例代码21.6设置X射线效果——xray接上页21.6设置X射线效果——xray网页效果21.7设置波浪效果——wave基本语法filter：wave（add=tr

7、ue（false），freq=频率，lightstrength=光强，phase=偏移量，strength=强度）21.7设置波浪效果——wave语法说明——wave属性包含的参数说明21.7设置波浪效果——wave实例代码21.7设置波浪效果——wave接上页21.7设置波浪效果——wave网页效果21.8设置阴影——dropshadow基本语法filter：dropshadow（color=color，offx=offx，offy=offy，positive=positive）21.8设置阴影——dropsha