基本语法如下：
.selector {
filter: filter-function(value);
}
其中 filter-function 是一个表示滤镜效果的函数，而 value 是该函数的参数。以下是一些常见的滤镜效果：
1. blur(value): 模糊图像，value 是模糊的程度，可以是像素值或百分比。
.blurred-image {
filter: blur(5px);
}
2. brightness(value): 调整图像的亮度，value 可以是百分比或一个小数。
.brightened-image {
filter: brightness(150%);
}
3. contrast(value): 调整图像的对比度，value 可以是百分比或一个小数。
.contrasted-image {
filter: contrast(200%);
}
4. grayscale(value): 将图像转为灰度，value 是一个百分比，表示灰度的程度。
.gray-image {
filter: grayscale(80%);
}
5. sepia(value): 将图像转为深褐色，value 是一个百分比，表示深褐色的程度。
.sepia-image {
filter: sepia(50%);
}
6. invert(value): 反转图像的颜色，value 是一个百分比，表示反转的程度。
.inverted-image {
filter: invert(100%);
}
这些只是一些常见的滤镜效果，filter 属性支持多个滤镜函数的组合，以及其他更复杂的效果。需要注意的是，一些滤镜效果可能对性能有影响，尤其是在处理大图像或动画时。
转载请注明出处：http://www.zyzy.cn/article/detail/4179/CSS