CSS滤镜

时间:2023-03-08 16:33:27
  • Filter属性介绍
  • Alpha滤镜的使用
  • Blur滤镜的使用
  • Filph、Filpv滤镜
  • DropShadow滤镜
  • Glow 滤镜
  • Gray ,Invert,Xray 滤镜
  • Shadow滤镜

19.1 Filter属性介绍

设置或检索对象所应用的滤镜或滤镜集合。此属性仅作用于有布局的对象,如块对象。内联要素要使用该属性,必须先设定对象的 height或 width属性,或者设定 position属性为 absolute,或者设定 display属性为 block。请参阅对象的 hasLayout属性。若要在 img对象上应用 shadow滤镜,可以在该对象 img对象的父容器上应用。滤镜的机制是可扩展的。通过利用Microsoft® DirectX® Media SDK,你可以使用C++开发和使用第三方滤镜。该属性在MAC平台上不可用。对应的脚本特性为 filter。

19.2 Alpha滤镜的使用

属性            值                说明
opacity           0-100            对象的亮度
style            1,2,3            滤镜的样式

例:Filter:alpha( opacity=100,style=3)

19.3 Blur滤镜的使用

属性            值              说明
add           true/false        是否印象派
direction        0-360            角度
strength        数字            模糊度

19.4 Fliph、Flipv滤镜

属性            值              说明
  无

19.5 DropShadow滤镜

属性            值              说明

color            颜色            阴影颜色
offx            数字            x坐标偏移

offy            数字            y坐标偏移
positive          true/false        是否建立透明

19.6 Glow 滤镜

属性             值             说明
color            颜色            发光颜色
 strength         数字            发光厚度

19.7 Gray ,Invert,Xray 滤镜

属性            值              说明
 无

19.8 Shadow 滤镜

属性            值             说明
color          颜色            阴影颜色

direction        0-360          阴影方向

strength        数字            阴影厚度