一般在一些影响力很大的伟人逝世的时候或全国哀悼日，身为站长的我们也想让自己的网站的全部变成灰色(黑白色)，以表示我们对逝者的悼念。青锋建站给大家分享一个简单的方法来实现实现网站全部变成黑白色灰色。实现的方法我们主要使用CSS的滤镜效果，如果网站没有引入H5标准，可能会不生效。
网站变成黑白色思路分析
使全部网站变成灰色(黑白色)的主要实现是简单效率，我们可以放在全局加载的CSS文件、全站的头部以实现快速反应。通过CSS的滤镜效果就可以实现这一功能。以下是具体效果。
网站变成黑白色的CSS代码
html {filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%);}
或者
html{
filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: url("data:image/svg+xml;utf8,#grayscale"); filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(1);
}
代码嵌入
A-放在CSS文件中，直接复制上述代码中的一个直接复制到全局CSS文件的开头；
B-放在网页头部时，先检查网站是否采用新H5标准<!DOCTYPE html><html>如果没有请加入。然后在头部标签<head></head>内添加即可。
C-也可以在BODY标签内添加内联样式，但是这里青锋建站不建议大家这么做。
以上是青锋建站给大家分享一个简单的方法来实现实现网站全部变成黑白色灰色的CSS代码。青锋建站，提供专业的高品质网站制作服务，包括网站建设服务，SEO，网络营销，PHP开发，网站建设知名品牌，全国接单，专业做优化型网站，为企业构建营销平台。
B-放在网页头部时，先检查网站是否采用新H5标准<!DOCTYPE html><html>如果没有请加入。然后在头部标签<head></head>内添加即可。
C-也可以在BODY标签内添加内联样式，但是这里青锋建站不建议大家这么做。
以上是青锋建站给大家分享一个简单的方法来实现实现网站全部变成黑白色灰色的CSS代码。青锋建站，提供专业的高品质网站制作服务，包括网站建设服务，SEO，网络营销，PHP开发，网站建设知名品牌，全国接单，专业做优化型网站，为企业构建营销平台。
转载请注明来源网址：青锋建站-http://www.sjzphp.com/webdis/heibaise_1554.html
