妙用CSS滤镜为图片加上特殊效果

有时候，我们需要给网页中的图片加一些特殊的效果，比如透明、扭曲、阴影或者翻转等，我们一般都会想到用Photoshop等一些图形软件来处理，其实我们也可以利用CSS(层叠式样表)提供的一些滤镜来处理，这对于不熟悉Photoshop的网友来说，是非常好的一件事。
 
     我们先从较简单的开始，介绍几个没有参数的滤镜。
     1.Gray滤镜
    Gray滤镜的作用是产生黑白效果
    使用方法：<img src="a.gif" style="filter:gray">
    效果如图所示
 
     2.Invert滤镜
    Invert滤镜的作用是反色效果
    使用方法：<img src="a.gif" style="filter:invert">
    效果如图所示
 
     3.Xray滤镜
    Xray滤镜的作用是产生X光效果
    使用方法：<img src="a.gif" style="filter:xray">
    效果如图所示
 
     4.fliph和flipv
    fliph滤镜的作用是产生水平翻转效果；flipv滤镜的作用是产生垂直翻转效果
    使用方法：<img src="a.gif" style="filter:fliph">或<img src="a.gif" style="filter:flipv">
    效果如图所示
 
     
     接下来，我们再介绍几个比较复杂的滤镜：
 
     5.alpha滤镜
    alpha滤镜作用主要是对图片的透明度进行处理
    使用方法：<img src="a.gif" style="filter:alpha(opacity=value1,finishopacity=value2,style=value3)">
    说明：value1为图片的透明值，范围是0（完全透明）～100（完全不透明）
     value2为图片透明度变换结束时的透明值，范围是0（完全透明）～100（完全不透明） 注：该值只有在value3设定时才有效
第 1 2 3 页