利用CSS实现网站黑白效果代码

Chrome、火狐

 代码如下 复制代码

<style type=”text/css”>
html {
filter: url(“data:image/svg+xml;utf8,<svg%20xmlns=’http://www.w3.org/2000/svg’><filter%20id=’grayscale’><feColorMatrix%20type=’matrix’%20values=’0.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200′/></filter></svg>#grayscale”); /* Firefox 3.5+ */
filter: gray !important; /* IE6+ */
filter: grayscale(100%); /* Current draft standard */
-webkit-filter: grayscale(100%); /* New WebKit */
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
* {
filter: gray !important; /* IE6+ */
}
</style>

一句代码支持IE

 代码如下 复制代码

html { filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
时间： 2024-09-22 09:13:44

利用CSS实现网站黑白效果代码的相关文章

利用CSS改善网站可访问性

css|访问  利用CSS改善网站可访问性    作者: BUILDER.COM来源: www.BUILDER.COM类型: 翻译     最近,我不得不对我的一个客户的旧网站进行更新,使得它能够达到可访问性的标准.对三四年前的旧代码进行挖掘的想法根本没有吸引力,主要是因为我曾经使用的很多编程惯例已经不再适用,特别是从可访问性上来讲.我曾经使用绝对的字体大小,固定的页面宽度和表格来做版面设计和空间分配.     像那时建构的很多网站一样,我的客户的网站使用了Cascading Style She

jquery利用json实现地区联动效果代码

jquery利用json实现地区联动效果代码 不过看到的里面json类型格式设计的挺好的,一般我们后台未做任何处理的json数据格式类似以下这样子的 [{"Code":3231,"Name":"长春市"}, {"Code":3232,"Name":"吉林市}] 如果有一万个地区,会多出几万个字符,这么奢侈的做法我想我还是放弃了吧 地区表大致设计为 AT_Id :唯一标识,json里面对应的code

css实现图片圆角效果代码

 代码如下 复制代码 <!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"> <head> <meta http-equiv=&qu

网站重构：利用CSS改善网站可访问性

css|访问|网站重构   最近,我不得不对我的一个客户的旧网站进行更新,使得它能够达到可访问性的标准.对三四年前的旧代码进行挖掘的想法根本没有吸引力,主要是因为我曾经使用的很多编程惯例已经不再适用,特别是从可访问性上来讲.我曾经使用绝对的字体大小,固定的页面宽度和表格来做版面设计和空间分配.   像那时建构的很多网站一样,我的客户的网站使用了Cascading Style Sheets (CSS)来格式化文本.它没有使用任何CSS的更加强有力的版面设计功能,也没有允许HTML设备独立,而这是C

利用CSS的:hover做相册效果

css   实现原理 这个效果的原理很简单,利用:hover伪类,然后利用display控制内容的隐藏和显示,显示的内容采用position定位到你想要的位置就可以了. 从一个简单的例子中看看具体怎么实现的 这里是例子代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&

利用CSS改善网站可访问性(2005-02-21 10:13:09)

css|访问 最近,我不得不对我的一个客户的旧网站进行更新,使得它能够达到可访问性的标准.对三四年前的旧代码进行挖掘的想法根本没有吸引力,主要是因为我曾经使用的很多编程惯例已经不再适用,特别是从可访问性上来讲.我曾经使用绝对的字体大小,固定的页面宽度和表格来做版面设计和空间分配. 像那时建构的很多网站一样,我的客户的网站使用了Cascading Style Sheets (CSS)来格式化文本.它没有使用任何CSS的更加强有力的版面设计功能,也没有允许HTML设备独立,而这是CSS可访问性的主要

JS+CSS实现闪烁字体效果代码_javascript技巧

本文实例讲述了JS+CSS实现闪烁字体效果的方法.分享给大家供大家参考,具体如下: <div id="blink">闪烁的文字</div> <script language="javascript"> function changeColor(){ var color="#f00|#0f0|#00f|#880|#808|#088|yellow|green|blue|gray"; color=color.spli

IE7,IE8浏览器CSS实现正圆角效果代码

一.关于IE7, IE8不支持CSS3 border-radius CSS3 border-radius可以轻易实现圆还有圆角效果,然而,需要IE9+浏览器才行.移动端自然不成问题,但是众多(尤其面向C侧)PC页面是至少需要兼容IE8的,那有没有什么办法可以让IE7, IE8也支持圆角呢? 很久很久以前介绍过一个名为PIE的东西可以实现IE7,IE8的圆角,是10年7月份写的一篇"PIE使IE支持CSS3圆角盒阴影与渐变渲染"(本文还有其他很多圆角方法介绍). 其原理是利用的IE私有的

利用CSS滤镜让网页效果更有风格

在进行网站设计的时候,很多的效果并不用在photoshop里进行设计!中国WebSite网认为完全可以在网页里可以用javascript来实现也可以用css滤镜便可以方便的设计出来! 语法:STYLE="filter:filtername(fparameter1, fparameter2...)" (Filtername为滤镜的名称,fparameter1.fparameter2等是滤镜的参数) 滤镜说明: alpha:设置透明层次 blur:创建高速度移动效果,即模糊效果 chrom