一键让网站全站变灰的CSS代码
在纪念日或哀悼日，很多网站会全站变灰以示庄重。本文提供一段简洁的CSS代码，复制到网站任意位置即可实现全站灰白效果，并附上恢复彩色的方法。
💡 快速判断提供全站变灰CSS代码，实现简单快捷，适合纪念日等场景。适合需要快速实现网站灰度效果的站长，不适合追求个性化或动态效果的用户。
网站全站变灰代码
在特殊的日子，比如公祭日、纪念日或哀悼日，许多网站会将整个页面变为灰色调，以表达庄重与缅怀。如果你也想为自己的网站快速实现这种效果，只需将以下代码粘贴到网站首页的任意位置（如 <head> 或 <body> 中），即可立即生效。
网站全站变灰效果
启用这段代码后，网站中的所有元素，包括文字、图片和背景，都会转为灰度显示，整体呈现黑白视觉效果。这种设计常用于悼念活动，既简洁又庄重。
变灰代码
以下是一段简洁的 CSS 代码，能够快速将整个网站变为灰色：
html {
filter: grayscale(100%);
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
将上述代码添加到你的样式表或直接嵌入页面 <style> 标签中，即可实现全站灰度效果。如果需要恢复彩色，只需移除这段代码或将其中的 grayscale(100%) 改为 grayscale(0%) 即可。
相关
- 如果你希望更灵活地控制，可以结合 JavaScript 动态切换灰度状态。
- 一些网站还提供了“黑白网页恢复彩色”的插件，方便用户一键切换。
项目信息
- 官方网站：https://www.example.com
- GitHub 项目主页：https://github.com/example/grayscale