一、Css3 将网页变成黑白_Css3 网页黑白滤镜filter
重点代码：
html,
body {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
全部代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
html,
body {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
.red {
color: red;
}
</style>
</head>
<body>
<p>测试文字</p>
<h1 class="red">红色文字</h1>
<img src="http://www.jnqianle.cn/upload/logo/content/202204/01/3b68f8d0-cdb3-49cb-b4e9-d518700047b6.jpg" width="500" alt="">
</body>
</html>
效果：
更多：
Canvas模糊化处理图片、毛玻璃处理图片之stackblur.js
标签：Css3,网页,grayscale,100%,黑白,filter From： https://www.cnblogs.com/tianma3798/p/16945346.html