码迷,mamicode.com
首页 > Web开发 > 详细

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

时间:2014-10-18 22:13:40      阅读:228      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   os   ar   for   sp   div   

2013-07-21 15:06:47

北京时间2013420802分四川省雅安芦山县(北纬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);

}

例如新浪网:

bubuko.com,布布扣

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搜索

bubuko.com,布布扣

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

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

bubuko.com,布布扣

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

标签:style   blog   http   color   os   ar   for   sp   div   

原文地址:http://www.cnblogs.com/huanghongxia/p/4033653.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!