19,CSS 滤镜
Posted liu-zhijun
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了19,CSS 滤镜相关的知识,希望对你有一定的参考价值。
1.Filter 属性介绍
2.Alpha 滤镜的使用
3.Blur 滤镜的使用
4.Filph、Filpv 滤镜
5.DropShadow 滤镜
6.Glow 滤镜
7.Gray ,Invert,Xray 滤镜
8.Shadow 滤镜
1 19.1 F Fr ilter 属性介绍
设置或检索对象所应用的滤镜或滤镜集合。此属性仅作用于有布局的对象,如块对象。
内联要素要使用该属性,必须先设定对象的 height 或 width 属性,或者设定 position 属
性为 absolute,或者设定 display 属性为 block。请参阅对象的 hasLayout 属性。若要在
img 对象上应用 shadow 滤镜,可以在该对象 img 对象的父容器上应用。滤镜的机制是可扩
展的。通过利用 Microsoft® DirectX® Media SDK,你可以使用 C++开发和使用第三方滤镜 。
该属性在 MAC 平台上不可用。对应的脚本特性为 filter。
2 19.2 a Alpha 滤镜的使用
属性 值 说明
opacity 0-100 对象的亮度
style 1,2,3 滤镜的样式
2 19.2 r Blur 滤镜的使用
属性 值 说明
add true/false 是否印象派
direction 0-360 角度
strength 数字 模糊度
3 19.3 Fliph 、 Flipv 滤镜
属性 值 说明
无
4 19.4 w DropShadow 滤镜
属性 值 说明
color 颜色 阴影颜色
offx 数字 x 坐标偏移
offy 数字 y 坐标偏移
positive true/false 是否建立透明
19.5 5 w Glow 滤镜
属性 值 说明
color 颜色 发光颜色
strength 数字 发光厚度
6 19.6 y Gray y ,Invert,Xray 滤镜
属性 值 说明
无
7 19.7 w Shadow 滤镜
属性 值 说明
color 颜色 阴影颜色
direction 0-360 阴影方向
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <style type="text/css"> div{ background: orange; width:200px; height:150px; } img{ filter: alpha(style=2,opacity=70); } </style> </head> <body> <div>滤镜的使用</div> <img src="images/pic7.jpg"/> </body> </html>
以上是关于19,CSS 滤镜的主要内容,如果未能解决你的问题,请参考以下文章