首页 > 代码库 > 转载网易博客：整理各大网站让网站变灰的css代码

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

2024-07-27 22:03:28   218人阅读

2013-07-21 15:06:47

北京时间2013年4月20日8时02分四川省雅安市芦山县（北纬30.3,东经103.0）发生7.0级地震。震源深度13公里。各大网站将其网站变灰，本人整理了下部分网站变灰的css代码。

1、将网站全部变灰

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… 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0‘/></filter></svg>#grayscalerayscale");filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(1);}

例如新浪网：

新浪变灰

2、网站部分变灰

#search-button{ 
　　display:inline-block; 
　　width:100px; 
　　height:40px; 
　　_height:42px; 
　　margin-left:5px; 
　　outline:0; 
　　border:1px solid #999; 
　　box-shadow:0 1px 1px rgba(0,0,0,0.2); 
　　-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.2); 
　　text-shadow:0 -1px 0 rgba(0,0,0,0.1); 
　　-webkit-text-shadow:0 -1px 0 rgba(0,0,0,0.1); 
　　-moz-text-shadow:0 -1px 0 rgba(0,0,0,0.1); 
　　background:url(‘http://p1.qhimg.com/gray/d/_onebox/btn-98-114.png‘) no-repeat #3eaf0e; 
　　color:white; 
　　font:bold 16px ‘Microsoft YaHei‘,sans-serif; 
　　vertical-align:top; 
　　cursor:pointer; 
}

如360搜索

360搜索

3、利用图片实现网页背景变灰

.background{    bbackground: url(http://y1.ifengimg.com/2f86f1d4ae63c9a4/2013/0422/bk130421.jpg) no-repeat center top;}

凤凰网

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


联系
我们