2、css滤镜主要包括：
Speia滤镜 灰度图滤镜 高斯模糊滤镜 反色滤镜 饱和度滤镜
对比度滤镜亮度滤镜色相旋转滤镜 阴影滤镜
3、css滤镜在浏览器兼容是比较坑爹的问题，ie浏览器有自己一套滤镜filter家族，基本所有ie内核浏览器都支持，ff和Chrome，opera则主要使用css3的滤镜，这些浏览器在后期版本支持css3的滤镜（目前版本基本都支持html5和css3），通过滤镜改变背景图的颜色和效果，当然这些滤镜主要是为了效果而产生，颜色只是固定的几种效果。
4、个别时候，css滤镜还需要结合js使用，才能到达必要效果，其实一般背景图片都是用透明度的css来设置它的颜色度；
透明度css列子：
transparent_class {
filter:alpha(opacity=50)
-moz-opacity:0.5
-khtml-opacity: 0.5
opacity: 0.5
}
加了代码网页变黑白没效果的进 这里有所有的代码教程下面我们来看看如何将网页变成黑白的。如果你的网站是静态页面，能够支持支持CSS，那就方便很多了。只要是符合W3标准的网页，在CSS文件的最前面加上一行代码就可以了，这段代码使用的是CSS滤镜，将网页中的色彩部分给滤掉了。
CSS滤镜过滤色彩代码：
html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1)}
使用方法：这段代码可以变网页为黑白，将代码加到CSS最顶端就可以实现素装。
有一些站长的网站可能使用这个css 不能生效，是因为网站没有使用最新的网页标准协议
<!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">
请将网页最头部的替换为以上代码。
有一些网站FLASH动画的颜色不能被CSS滤镜控制，可以在FLASH代码的和之间插入：
<param value="false" name="menu"/>
<param value="opaque" name="wmode"/>
最简单的把页面变成灰色的代码是在head 之间加
<style type="text/css">
html {
FILTER: gray
}
</style>
或者：
<body style="filter:Gray">
这样做，product和steel的标签名称不限，即div、span、dl都不限。写一点CSS样式必要时用上js，做到以下：
1、2个steel与product分属不同的标签块
2、未被鼠标激活时，product的样式为无边线，只有文字显示。steel不显示不占据空间(display:none)
3、当被鼠标激活高亮hover显示时，
product的样式变为:上、左、右三面有边线，而底边无边线。且Z轴高于其余的Resource等块。
steel的样式为上下左右四面都有边线。Z轴高于其余的Resource等块，但低于product块。
并显现占据空间display: block
这样product在上steel在下的两个块重叠，由product块遮住一段上部边线，就能产生这样效果。
