css 网页变灰色各种方法总结

直接在css中如下加

在你的CSS开始加一句:

 代码如下 复制代码

  * {

  FILTER: gray

  }

  .clear {

  CLEAR: both

  }

  BODY {

  BACKGROUND-REPEAT: repeat-x

  }

但上面的只能在ie浏览器中使用 并且flash 还无效

如果需要使网站变灰,在网页上加层滤镜就可以了。

 代码如下 复制代码

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

或者:

html { FILTER: gray }

有的时候加上后可能不生效,是因为网站没有使用最新的网页标准协议。

需要在页面里加上:

 代码如下 复制代码

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

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

网站的FLASH动画的颜色不能被CSS滤镜控制,需要在FLASH代码的<object…>和</object>之间加上:

 代码如下 复制代码

<param value="false" name="menu"/> 
<param value="opaque" name="wmode"/>

兼容主流浏览器的全站变灰CSS代码:

 代码如下 复制代码

html {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix'  values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscalerayscale");
    filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); zoom: 1;
}

时间: 2024-09-08 09:05:01

css 网页变灰色各种方法总结的相关文章

DIV+CSS网页布局常用的方法与技巧

css|技巧|网页 CSS布局常用的方法 float:none|left|right 取值: none:默认值.对象不飘浮 left:文本流向对象的右边 right:文本流向对象的左边 它是怎样工作的,看个一行两列的例子 xhtml代码: Example Source Code <div id="wrap"> <div id="column1">这里是第一列</div> <div id="column2&qu

实例讲解:DIV CSS网页布局常用的方法和技巧

css|技巧|网页 CSS布局常用的方法float:none|left|right 取值:none:默认值.对象不飘浮left:文本流向对象的右边right:文本流向对象的左边  它是怎样工作的,看个一行两列的例子 xhtml代码:<div id="wrap"> <div id="column1">这里是第一列</div> <div id="column2">这里是第二列</div>

哀悼死难同胞 网站变灰色的方法

四川汶川大地震牵动着华夏儿女的心.国务院决定,2008年5月19日至21日为全国哀悼日.5月19日14时28分起,全国人民默哀3分钟,届时汽车.火车.舰船鸣笛,防空警报鸣响.在今天当你看到,有很多网站界面都变成了黑白色,你可能会怀疑是网站的问题,或者显示器的问题.不!这些都是网站在这个特别的日子里,通过这个方式来纪念那些在地震中死去的同胞.作为中国IT互联网中的站长,此时此刻应该都很想做点什么,除了为灾区慷慨解囊,还可以通过自己的网站为死难同胞做点事情,来吧!将自己的网站也变成黑白色,来缅怀那些

Css网页加灰色蒙版

html, img, select, iframe{*filter:gray;}

把网页变灰色兼容各种浏览器

 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,<svg xmlns='http://www.w3.org/2000/svg'><filter id='

网站网页变灰的网页代码怎么实现?

文章简介:四川雅安芦山发生7.0级别大地震,不少网站首页已经变成了灰色表示哀悼.下面笔者整理了几种让网页变灰色的CSS代码,供各位站长参考! 4月21日全国哀悼日网页变灰色的CSS代码 http://www.webjx.com/css/divcss-23270.html  四川雅安芦山发生7.0级别大地震,不少网站首页已经变成了灰色表示哀悼.下面笔者整理了几种让网页变灰色的CSS代码,供各位站长参考! 方法1:支持IE <!DOCTYPE html PUBLIC "-//W3C//DTD

网页变黑白代码(让FLASH也变黑)

文章简介:使网页所有元素变灰的代码,包括FLASH,只支持IE. 网站网页变灰的网页代码怎么实现:http://www.webjx.com/css/divcss-33559.html 4月21日全国哀悼日网页变灰色的CSS代码: http://www.webjx.com/css/divcss-23270.html  使网页所有元素变灰的代码,包括FLASH,只支持IE: 第一种方法:把下面的代码加入网页的<head>与</head>之间: <style type="

CSS网页制作技巧:DIV+CSS网页布局常犯错误汇总

文章简介:随着CSS网页布局越来越普及,国内大部分网站已经采用CSS网页布局的制作方法.在应用DIV+CSS编码时很容易犯一些错误,这里列举一些常见的错误,帮助新手朋友更好的学习与进步. 随着CSS网页布局越来越普及,国内大部分网站已经采用CSS网页布局的制作方法.在应用DIV+CSS编码时很容易犯一些错误,这里列举一些常见的错误,帮助新手朋友更好的学习与进步. 一.检查HTML元素是否有拼写错误 是否忘记结束标记 即使是老手也经常会弄错div的嵌套关系.可以用dreamweaver的验证功能检

如何提高CSS网页渲染效率

  如何提高CSS网页渲染效率?CSS学习过程中需要关注的细节之处非常多,而这些细节之处也是影响CSS的网页渲染效率的重要因素,黑猫整理了由前辈们提出的提高CSS网页渲染效率的方法,一起来学习一下. 1.十六进制的颜色值对位数与大小写 编写十六进制颜色值时你可能会用小写字母或省略成3位数,关于这写法没找到确实的数据证明对浏览器的渲染效率是否有影响,但十六进制的颜色值默认标准是大写及6位数标注.在未知情况下不希望冒险而降低了渲染的效率. * 不赞成 - color:#f3a; * 建议用 - co