html+css+javascript 标准实例教程(第二版)21

html+css+javascript 标准实例教程(第二版)21

ID:43090716

大小:4.33 MB

页数:71页

时间:2019-09-29

html+css+javascript 标准实例教程(第二版)21_第1页
html+css+javascript 标准实例教程(第二版)21_第2页
html+css+javascript 标准实例教程(第二版)21_第3页
html+css+javascript 标准实例教程(第二版)21_第4页
html+css+javascript 标准实例教程(第二版)21_第5页
资源描述:

《html+css+javascript 标准实例教程(第二版)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,finishy=f

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

4、=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设置水平/垂直翻转——f

5、liph/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;两个属性中间用空格隔开,代表水平垂直翻转。21.4

6、设置灰度——基本语法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=true(false),fr

7、eq=频率,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

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。