css 黑白滤镜

作者：铁打的心，也会穿孔，发布日期:2026-07-23 浏览:98

/* 使用 CSS 实现黑白滤镜效果 */

/* 选择要应用黑白滤镜的图片或元素 */
img {
  /* 使用 filter 属性的 grayscale() 函数将图像转换为灰度（黑白） */
  filter: grayscale(100%);
}

filter: grayscale(100%);：grayscale() 函数用于将图像转换为灰度图像。参数值为 100% 表示完全转换为黑白，值为 0% 则表示不应用黑白效果，也可以使用介于 0% 和 100% 之间的值来实现不同程度的灰度效果。

如果需要对其他元素应用黑白滤镜，只需将 img 替换为相应的选择器即可。