[CSS技巧] 使用黑白效果来改变网站外观

在一些特殊时期，或者特殊日子里，我们需要通过黑白样式展现网站。

要使用 CSS 中的黑白效果来改变网站的外观，你可以使用灰度滤镜（grayscale filter）来实现。下面是一个简单的示例：

代码示例：

body {
  filter: grayscale(100%); /* 将整个页面转为黑白 */
}

将上述代码应用到你的 CSS 文件中的 body 元素上，这将使整个网站的内容都转为黑白显示。你也可以将上述样式应用于其他特定的元素或类，以局部地应用黑白效果。

如果你只想对某个特定区域或元素应用黑白效果，你可以通过选择器来指定相应的元素，并应用灰度滤镜样式。以下是一个例子：

.header {
  filter: grayscale(100%); /* 将 .header 区域转为黑白 */
}

在上述示例中，使用了 .header 类选择器来选择某个具体区域，并将其内容转为黑白显示。

请注意，灰度滤镜只是一种视觉效果，它不会真正改变网站内容的颜色或样式。因此，当你需要将网站转为黑白时，确保你的设计元素和图像在黑白模式下仍然具有良好的可读性和可识别性。