Saber 酱的抱枕

Fly me to the moon

09/18
2016
学习

使用CSS滤镜将网页变成黑白（灰色）

saber 撰写 无回复 2,985次查看 
body {
	filter:grayscale(100%);
	-webkit-filter:grayscale(100%);
	-moz-filter:grayscale(100%);
	-ms-filter:grayscale(100%);
	-o-filter:grayscale(100%);
	filter:url("data:image/svg+xml;	utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
	filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
	filter:gray;
	-webkit-filter:grayscale(1);
}

之前我也发过一篇文章，实验了用css滤镜将网页变成灰色，但是那个不太完善。

今天在百度百科看到某位明星的词条变成黑白了，便扒下来代码保存一下。

但是这份代码也有个没能解决的问题：
无法把body上设置的背景图片变成灰色。

使用CSS滤镜将网页变成黑白（灰色）