您的位置：首页 > 运维架构 > 网站架构

哀悼的CSS 把网站变成灰色

2013-04-22 00:06 531 查看
中国,再一次的受到灾害,在大自然面前人的生命闲的那么脆弱,对经历过失去最亲的人的我对这感同身受.我们不能赶赴现场救助他们,但是我们都有一颗中华儿女的心.让我们在网络的世界中为他们祈福.

在页面<head></head>标签对的第一个<link />标签的CSS的第一行加入

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=\'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>#grayscale");filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(1);}


　　上面的代码兼容 IE Chrom18+ FireFox 但是在Opera下面没有效果.

　　查看更多有关csss-filter的信息可以查阅 Mozilla 开发者网站的 Filter参考,地址在: https://developer.mozilla.org/zh-CN/docs/CSS/filter#Gecko_notes

　　这里还有一片专门关于滤镜的文章 : http://www.html5rocks.com/en/tutorials/filters/understanding-css/
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航