一条css让整个网页由彩色变成灰色

一条 css 实现

html {
  filter: grayscale(1);
}

[1]

grayscale() : 对图片进行灰度转换，它是 <filter-function> 的子属性。

语法

grayscale(amount);

参数

• amount
  转换值的大小，可以是 <number> 或 <percentage>. 当值为 100% 时，灰度最大。0% 时与原图没有区别。0% 到 100% 之间的值会使灰度线性变化。amount 为空时使用值为 1.

例子

grayscale(0)     /* 无效果 */
grayscale(.7)    /* 70% 灰度 */
grayscale(100%)  /* 灰度最大 */

---

1. 参考 MDN: grayscale() ↩︎