方法1:支持IE

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

<html xmlns=”http://www.w3.org/1999/xhtml”>

<style>

html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}

</style>

说明:此方法支持IE,不支持Firefox和Chrome等非IE内核浏览器。

方法2:支持IE

body {filter:gray}

说明:此方法支持IE,不支持Firefox和Chrome等非IE内核浏览器。
提示:虽然这个方法代码量最小,但是效果却不好,而且网页也比较卡。

方法3:同时支持IE和Chrome

<style>

html {overflow-y:scroll;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%);}

</style>

说明:此方法支持IE浏览器、Safari和Chrome等浏览器,但是不支持Firefox浏览器。

方法4:使用grayscale.js插件

使用grayscale.js插件。这个插件是模拟IE的filter:progid方,官网地址在:

http://james.padolsey.com/javascript/grayscaling-in-non-ie-browsers/

使用方法:

<script src=”http://james.padolsey.com/demos/grayscale/grayscale.js” type=”text/javascript”></script>

<script type=”text/javascript”>

window.onload=function(){

grayscale(document.body);

}

</script>

说明:支持IE、Safari、Chrome、Opera和Firefox等浏览器。
问题:这个在IE下也挺占资源的。

建议:使用方法3,虽然不支持更多的浏览器,但是稳定、速度快,而且资源占用小。

让网站变灰的CSS代码(支持IE、FIREFOX和CHROME)(转)的更多相关文章

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

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

  2. 让网站变灰的CSS代码(支持IE、FIREFOX和CHROME)

    方法1:支持IE <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xht ...

  3. 全站变灰的CSS代码-适合特殊时刻哀悼

    将下面CSS代码应用到HTML标签或者是BODY标签 filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.o ...

  4. 网页变灰的CSS代码

    body *{ -webkit-filter: grayscale(100%); /* webkit */ -moz-filter: grayscale(100%); /*firefox*/ -ms- ...

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

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

  6. CSS IE6/7/8, Firefox, Safari, Chrome, Opera Hack使用简要归纳(转)

    网上有很多关于IE6/7/8, Firefox, Safari, Chrome, Opera CSS Hack的文章,但我觉得太过繁杂,要不给出一张看也看不懂的CSS Hack归纳表,要不就是给出一大 ...

  7. 一句css代码让网站变灰

    <style> html{ -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grays ...

  8. 网站变灰css

    html{ filter: grayscale(100%); -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-fi ...

  9. 彩色网页变黑白色CSS代码变黑白色调!

    <style> html { -webkit-filter: grayscale(%); -moz-filter: grayscale(%); -ms-filter: grayscale( ...

随机推荐

  1. 服务器端获取表单数据的编码解码问题(servlet)

    首先需要明确指出的是,这里的服务器是指tomcat. 在页面没有明确指定编码的情况下,客户端通过input标签和字符串向服务器传递两个值param1和param2.如果直接使用request.getP ...

  2. 1.设计模式-------Iterator

    本文主要是参考<图解设计模式>写的读书笔记: 开发中我用到遍历集合时候,无非我常用的就是简单的for循环,foreach,iterator 这三种方式进行遍历! 当然这三种的效率: 学习I ...

  3. Python菜鸟之路:Python基础-逼格提升利器:装饰器Decorator

    一.装饰器 装饰器是一个很著名的设计模式,经常被用于有切面需求的场景,较为经典的有插入日志.性能测试.事务处理等. 装饰器是解决这类问题的绝佳设计,有了装饰器,我们就可以抽离出大量函数中与函数功能本身 ...

  4. 浅谈公平组合游戏IGC

    浅谈公平组合游戏IGC IGC简介 一个游戏满足以下条件时被叫做IGC游戏 (前面三个字是自己YY的,不必在意) 竞争性:两名玩家交替行动. 公平性:游戏进程的任意时刻,可以执行的操作和操作者本人无关 ...

  5. Virtualbox报错------> '/etc/init.d/vboxdrv setup'

    Ubuntu下VirtualBox本来可以很好地用的,今天早上一来就报错了,--提示如下内容: ---------------------------------------------------- ...

  6. Android N API预览

    Android N for Developers 重要的开发人员功能 多窗体支持 通知 JIT/AOT 编译 高速的应用安装路径 外出瞌睡模式 后台优化 Data Saver 高速设置图块 API 号 ...

  7. PostgreSQL 里面的 BIGSERIAL

    @Id@GeneratedValue(strategy = GenerationType.IDENTITY)private Long id; CREATE TABLE article( id BIGS ...

  8. js:深入函数的定义

    函数定义方式: 1.function fun1(){alert("fun1");}  //函数就是一个很特殊的对象.是一个Function的实例.事实上在内存中存储的操作是通过一个 ...

  9. htop的使用

    htop是top的增强版本.官网地址: http://hisham.hm/htop/ 这网站比较...... 实验环境: [root@miyan ~]# cat /etc/redhat-release ...

  10. python基础17 ---继承补充知识

    一.继承的顺序 1.在python中的类可以集成多个类,既然是继承多个类就有类的寻找顺序这么一说.其寻找方法就有广度优先和深度优先两种. 2.当类是新式类,多继承的情况下会按照广度优先的顺序查找. 如 ...