纪念日页面变灰是怎么实现的( filter: grayscale(100%)；)

在一些特殊的日子，我们可能会把页面变成灰色，我还有印象，有一次是一个国家纪念日，全部网页都变成了灰色，当时的4399小游戏都不能玩，我们思考一下他是怎么做到的呢，肯定不能一个一个的去改样式，其实他是用到了一个css的滤镜属性。举个例子：

 <div class="contain">
        <h1>如何成为一个好的前端工程师</h1>
        <h5>努力学习，不断进步</h5>
        <img src="./image/1.jpeg" alt="">
        <img src="./image/10.jpeg" alt="">
        <img src="./image/11.jpeg" alt="">
    </div>
<style>
    h5 {
        color: red;
    }
</style>

效果：

要想变成灰色，我们可以直接在最外层盒子上添加filter滤镜，大家看一下css代码：

<style>
    .contain{
        filter: grayscale(100%);
    }
    h5 {
        color: red;
    }
</style>

效果：