让网站所有元素变成灰色调,全浏览器支持,使用了滤镜,比较吃性能,建议作临时方案使用。

实现效果(点击下面的按钮):

这里放一张图片作为效果展示:

其CSS代码如下:

body{
-webkit-filter:grayscale(100%);
-moz-filter:grayscale(100%);
-ms-filter:grayscale(100%);
-o-filter:grayscale(100%);
filter:grayscale(100%);
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
filter:gray;
-webkit-transform: translateZ(0);
}

来源:网站变灰 CSS

【CSS Demo】网站页面变灰的更多相关文章

  1. css+js整站变灰(兼容IE7+)

    原文:css+js整站变灰(兼容IE7+) 历年大型地震等自然灾害来临过后,各大网站整站都变成灰色以悼念逝去的生命,那么这种整站变灰的效果是怎么做到的? 重写一套css?NO,即便你有这个时间重写,那 ...

  2. 怎么让让整个HTML页面变灰

    怎么让让整个HTML页面变灰 其实很简单,我们只需要一句话. html {filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1 ...

  3. JS实现当前页弹出窗口,且页面变灰不可操作

    使用JS在当前页面在div中加载弹出窗口,并让当前页面变灰不可操作. 加载弹出窗口的div需将宽高设置成整个页面的大小,以覆盖当前页面的内容. opacity:0.6: 页面可见度设置为0.6(1为完 ...

  4. 简单的一段css代码让全站变灰,网站哀悼代码

    为表达全国各族人民对抗击新冠肺炎疫情斗争牺牲烈士和逝世通报的深切哀悼,国务院今天发布公告,决定2020年4月4日举行全国性哀悼活动.在此期间,全国和驻外使馆下半旗致哀,全国停止公共娱乐活动,4月4日1 ...

  5. 网站哀悼变灰代码集合 兼容所有浏览器的CSS变暗代码

    下面这些CSS代码可以把网站的网页变为黑白,只需将代码加到CSS文件或网页最顶端就可以实现素装.建议全国站长动起来.为遇难的同胞哀悼. 如何将网站变成灰色调呢,网站变灰色方法是什么?有哪些?为了方便大 ...

  6. 使整个页面变灰的css代码

    * { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=); -webkit-filter: grayscale(%); - ...

  7. 通过Nginx使全站页面变灰

    摘要:某大神的博客说“在Nginx负载均衡服务器上,利用sub_filter指令在输出的HTML中增加一行:<style type="text/css">html {f ...

  8. 转载网易博客:整理各大网站让网站变灰的css代码

    2013-07-21 15:06:47 北京时间2013年4月20日8时02分四川省雅安市芦山县(北纬30.3,东经103.0)发生7.0级地震.震源深度13公里.各大网站将其网站变灰,本人整理了下部 ...

  9. 让页面整体变灰css设置

    上次看到某人去世了,百度就把相应介绍某人的信息页面全部灰掉,于是寻找到了种简单的方法,只需设置html html { filter: grayscale(100%); -webkit-filter: ...

随机推荐

  1. 并发之volatile关键字

    volatile关键字 volatile关键字是什么 在上一章我们讲到了并发的的三个概念,那么今天在讲解下在java中可以保证可见性和有序性的一个关键字. volatile关键字 :当变量的值被该关键 ...

  2. php中常用的正则表达式函数

    php中常用的正则表达式函数 * preg_match() * preg_match_all() * preg_replace() * preg_filter() * preg_grep() * pr ...

  3. html----属性操作

    1.文本 十六进制值 - 如: #FF0000 一个RGB值 - 如: RGB(255,0,0) 颜色的名称 - 如:  red‘’RGBA() 2.水平对齐方式 text-align 属性规定元素中 ...

  4. python 全栈开发,Day2(in,while else,格式化输出,逻辑运算符,int与bool转换,编码)

    一.in的使用 in 操作符用于判断关键字是否存在于变量中 a = '男孩wusir' print('男孩' in a) 执行输出: True in是整体匹配,不会拆分匹配. a = '男孩wusir ...

  5. For each loop in Native C++

    今天发现 for each 语法居然可以直接编译通过,之前还以为只有开了/clr才可以支持.查了一下资料发现ms从vs2005就已经支持了.虽然不符合标准不过用着确实方便啊,必须记录一下. 具体看这里 ...

  6. hdu3311

    #include <bits/stdc++.h> using namespace std; #define maxn 10000 #define INF 6e8 ]; ][],v[]; s ...

  7. 【AtCoder】AGC018

    A - Getting Difference 我们肯定可以得到这些数的gcd,然后判断每个数减整数倍的gcd能否得到K #include <bits/stdc++.h> #define f ...

  8. Codeforces 1041F Ray in the tube (看题解)

    Ray in the tube 感觉是套路题.. 如果确定一个差值x我们如何取确定答案呢, 我们把a[ i ] -> a[ i ] % (2 * x), 把b[ i ] -> (b[ i ...

  9. MSF《构建之法》阅读笔记5

    第七章 MSF MSF是一种软件开发方法,MSF原则包括1推动信息共享和沟通,2为共同的远景而工作,3充分授权和信任,4各司其职,对项目共同负责,5交付增量的价值,6保持敏捷,预期和适应变化,7投资质 ...

  10. 076 Apache的HBase与cdh的sqoop集成(不建议不同版本之间的集成)

    1.修改sqoop的配资文件 2.从mysql导入到hbase(import) bin/sqoop import \ --connect jdbc:mysql://linux-hadoop3.ibei ...