CSS代码加滤镜将网站变为灰色/怎么把网站变为灰色

一、效果图

二、CSS代码

html{
background-color: rgb(238, 242, 245);
background-blend-mode: luminosity;
/*上面两行代码将有彩色背景图片的也调为灰色*/
filter: grayscale(95%);
-webkit-filter: grayscale(95%);
-moz-filter: grayscale(95%);
-ms-filter: grayscale(95%);
-o-filter: grayscale(95%);
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=.95);
}

CSS代码加滤镜将网站变为灰色(完整版)/怎么把网站变为灰色(完整版)的更多相关文章

  1. CssStats – 分析和优化网站 CSS 代码的利器

    CssStats 是一个在线的 CSS 代码分析工具,你只需要输入网址或者直接 CSS 地址即可进行 CSS 代码的全方位分析,是前端开发人员和网页设计师分析网站 CSS 代码的利器,可以统计出 CS ...

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

    2013-07-21 15:06:47 北京时间2013年4月20日8时02分四川省雅安市芦山县(北纬30.3,东经103.0)发生7.0级地震.震源深度13公里.各大网站将其网站变灰,本人整理了下部 ...

  3. 各大网站CSS代码初始化集合

    css代码之所以初始化,是因为能尽量减少 各浏览器之间的兼容性问题! 腾讯QQ官网 样式初始化 body,ol,ul,h1,h2,h3,h4,h5,h6,p,th,td,dl,dd,form,fiel ...

  4. (转)每位设计师都应该拥有的50个CSS代码片段

    原文地址:http://www.cnblogs.com/fengyuqing/archive/2013/06/15/css_50.html 面对每年如此多的 新趋势 ,保持行业的领先是个很困难问题. ...

  5. 很实用的50个CSS代码片段

    原文:50 Useful CSS Snippets Every Designer Should Have          面对每年如此多的 新趋势 ,保持行业的率先是个非常困难问题. 站点设计者和前 ...

  6. 20 个让你效率更高的 CSS 代码技巧

    在这里想与你分享一个由各大CSS网站总结推荐的20个有用的规则和实践经验集合.有一些是面向CSS初学者的,有一些知识点是进阶型的.希望每个人通过这篇文章都能学到对自己有用的知识. 1.注意外边距折叠 ...

  7. 实用的60个CSS代码片段

    1.垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑: .verticalcenter{ position: re ...

  8. 20个编写现代 CSS 代码的建议

    明白何谓Margin Collapse 不同于其他很多属性,盒模型中垂直方向上的Margin会在相遇时发生崩塌,也就是说当某个元素的底部Margin与另一个元素的顶部Margin相邻时,只有二者中的较 ...

  9. css样式加载顺序及覆盖顺序深入理解

    注:内容转载 很多的新手朋友们对css样式加载顺序和覆盖顺序的理解有所偏差,下面用示例为大家详细的介绍下,感兴趣的朋友不要错过 { height: 100%; width: 200; position ...

  10. 60个有用CSS代码片段

    1.垂直对齐 如果你用CSS,则你会有困惑:我该怎么垂直对齐容器中的元素?现在,利用CSS3的Transform,可以很优雅的解决这个困惑: .verticalcenter{ position: re ...

随机推荐

  1. 连表操作join 子查询 SQL补充 数据库软件navicat pymysql模块

    目录 多表查询的两种方法 方式1:连表操作 方式2:子查询 SQL补充知识点 1.分组之前字段拼接 concat concat_ws 2.SQL执行判断条件 exists 3.表相关SQL补充 修改表 ...

  2. EXACT函数

    EXACT函数:EXACT函数是一个文本函数,通过这个函数可以将不同的字符串进行对比,通常用于信息核对. EXACT函数的功能:比较两个字符串是否一致,返回不同的结果. EXACT函数的语法结构:EX ...

  3. Spring中11个最常用的扩展点,你知道几个?

    前言 在使用spring的过程中,我们有没有发现它的扩展能力很强呢? 由于这个优势的存在,使得spring具有很强的包容性,所以很多第三方应用或者框架可以很容易的投入到spring的怀抱中.今天我们主 ...

  4. week_Last

    Andrew Ng 机器学习笔记 总结! 注:等下用xmind做一个树状图! 来回忆知识! 所以...树状图待补.... 最后,谢谢吴恩达老师!! 感谢吴恩达老师的无私付出!!

  5. 新款 c++ web framework 支持orm http/2

    c++ web framework很少, 随着c++ 热度升温,c++ 在人工智能 自然语言处理 加快应用. 最近一款国产 c++ web framework 问世 写业务速度跟脚步语言一样速度 自带 ...

  6. 【Redis场景2】缓存更新策略(双写一致)

    在业务初始阶段,流量很少的情况下,通过直接操作数据是可行的操作,但是随着业务量的增长,用户的访问量也随之增加,在该阶段自然需要使用一些手段(缓存)来减轻数据库的压力:所谓遇事不决,那就加一层. 在当前 ...

  7. RocketMQ消息短暂而又精彩的一生

    大家好,我是三友~~ 这篇文章我准备来聊一聊RocketMQ消息的一生. 不知你是否跟我一样,在使用RocketMQ的时候也有很多的疑惑: 消息是如何发送的,队列是如何选择的? 消息是如何存储的,是如 ...

  8. 可持久化杀手——rope学习笔记

    概述 std::rope,内部一说是可持久化平衡树,一说是块状链表. 它可以实现很多可持久化数组问题. 基本使用 #include<bits/extc++.h> using namespa ...

  9. gRPC介绍(以Java为例)

    1.简介 1.1 gRPC的起源 RPC是Remote Procedure Call的简称,中文叫远程过程调用.用于解决分布式系统中服务之间的调用问题.通俗地讲,就是开发者能够像调用本地方法一样调用远 ...

  10. 发布并部署NCF站点的那些事

    简介 开工第一天,祝大家2023年钱兔无量,技术兔飞猛进 为更加方便大家一站式打通所有使用NCF的环节,在新年开工的第一天给大家带来如何发布最新版本的站点 无论你的网站在开发环境做的多么的炫酷,实用, ...