CSS3 filter滤镜

CSS3 filter属性用于应用模糊或颜色变换效果，常用于调整图片、文本或其他HTML元素的视觉效果。

以下是一些CSS3 filter的示例代码：

1. 模糊效果（blur）:

img {
  filter: blur(5px);
}

2. 亮度调整（brightness）:

img {
  filter: brightness(50%);
}

3. 对比度调整（contrast）:

img {
  filter: contrast(200%);
}

4. 灰度效果（grayscale）:

img {
  filter: grayscale(100%);
}

5. 色彩旋转（hue-rotate）:

img {
  filter: hue-rotate(90deg);
}

6. 反色效果（invert）:

img {
  filter: invert(100%);
}

7. 饱和度调整（saturate）:

img {
  filter: saturate(30%);
}

8. sepia效果（sepia）:

img {
  filter: sepia(60%);
}

9. 影子效果（drop-shadow）:

img {
  filter: drop-shadow(16px 16px 20px red);
}

10. 混合效果（blend-mode）:

img {
  filter: blend(overlay);
}

每个滤镜都有其特定的用途和效果，可以根据需要选择合适的滤镜应用到HTML元素上。