晚上下班回到家中，惯例打开B站，B站首页变成了黑白色主题。
B站首页是如何做到的黑白主题？
如果首页html换成黑白风格的，这个好实现。可是每个视频封面图都重新做一张黑白的版本，每个视频都是up主自己的投稿视频啊，怎么保证封面图都能黑白色呢？后期靠人工换的话，那代价也大了，而且也很傻。
那么能不能靠技术手段解决呢？
让我们打开开发者工具看看页面具体的样式。
突然我发现在html根结点html标签下面有一个属性：filter: grayscale(1);
我们来看看MDN的解释：
grayscale( )表示灰度值，可以从0%～100%，也可以.grayscale( .1)grayscale( .55)这样写。当我们grayscale(1)时，就表示最大的灰度值，也就是说颜色只剩下了黑白。
真相大白，原来只需要一个css属性：filter: grayscale(1); 就可以将整个页面变为黑白色，色彩感觉像极了小时候的黑白电视。
更多
除了黑白色，我们还可以实现别的效果吗？是可以的，请注意filter属性，MDN如是说：
filterCSS属性将模糊或颜色偏移等图形效果应用于元素。滤镜通常用于调整图像，背景和边框的渲染。
模糊度：filter: blur();
对比度：filter: contrast();
色相旋转：filter: hue-rotate();
阴影：filter: drop-shadow() ;
