html {

    -webkit-filter: grayscale(1);

}

-webkit-filter（滤镜）有十种效果，分别是：




    // grayscale 灰度


    // sepia 褐色


    //saturate 饱和度


    // hue-rotate 色相旋转


    // invert 反色


    //opacity 透明度


    //brightness 亮度


    //contrast 对比度


    //blur 模糊


    //drop-shadow 阴影




 






												


											
css 让页面变灰色的更多相关文章
	

    
						
  1. 纯css实现图片或者页面变灰色
		
    前言 今天是个沉痛的日子,全国哀悼英雄,各大平台平日鲜丽的界面置纷纷换成了灰色,以表对逝者的安息与尊敬!!对付疫病,我没多大的本事,只能记录一点点知识来提升自己擅长的技术,待到将来能为国家尽一份绵薄之 ...
    
		
    2. 
						
  2. CSS实现图片变灰色及透明度
		
    [图片变灰] 每当遇到哀悼日,很多网站快速变灰色,来看看实现方式吧: 方式一,仅支持ie) html{filter:progid:DXImageTransform.Microsoft.BasicIma ...
    
		
    3. 
						
  3. css控制图片变灰色，彩色
		
    <A href="链接地址"><IMG src="p1.jpg" border="0"></A> < ...
    
		
    4. 
						
  4. 页面定制CSS代码初探（一）：页面变宽 文本自动换行 图片按比缩放
		
    初识博客 初写博客,先在设置里选了个喜欢的模板 第一眼就爱上了呢!那极简的风格,我喜欢!!但是,应用后,却发现... 纳尼!模板上右侧那张漂亮的图片呢?!我的怎么什么都没有.没有图片好难看啊,瞬间无爱 ...
    
		
    5. 
						
  5. css 网站变灰色
		
    网站变灰色 html{ -webkit-filter: grayscale(%); -webkit-filter: grayscale(); filter: grayscale(%); filter: ...
    
		
    6. 
						
  6. 用 CSS 隐藏页面元素
		
    用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0 将 visibility 设为 hidden 将 display 设为 none 将 position 设为 absolute ...
    
		
    7. 
						
  7. 用 CSS 隐藏页面元素的 5 种方法
		
    原文链接:用 CSS 隐藏页面元素的 5 种方法,转载请注明来源! 用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0.将 visibility 设为 hidden.将 disp ...
    
		
    8. 
						
  8. 通过Nginx使全站页面变灰
		
    摘要:某大神的博客说“在Nginx负载均衡服务器上,利用sub_filter指令在输出的HTML中增加一行:<style type="text/css">html {f ...
    
		
    9. 
						
  9. CSS 隐藏页面元素的 几 种方法总结
		
    用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0.将 visibility 设为 hidden.将 display 设为 none 或者将 position 设为 absolu ...
    
		
    10. 
						
  10. 【学习DIV+CSS】2. 学习CSS（一）--CSS控制页面样式
		
    1. CSS如何控制页面 使用XHTML+CSS布局页面,其中有一个很重要的特点就是“结构与表现相分离”(结构指XHTML,表现指CSS).有人这样描述这种分离的关系,结构XHTML好比一个人,表现C ...
    
		
    11. 
		

	


随机推荐
	

    
									
  1. ChaosBlade：从混沌工程实验工具到混沌工程平台
			
    ​简介: ChaosBlade 是阿里巴巴 2019 年开源的混沌工程项目,已加入到 CNCF Sandbox 中.起初包含面向多环境.多语言的混沌工程实验工具 chaosblade,到现在发展到面向 ...
    
			
    2. 
						
  2. [Go] 选择 Beego 的三个理由
			
    1. 项目支持角度较其它框架考虑的多一些,比如:目录结构的简单约定,内置项目配置读取,内置bee脚手架,热重载特性 等. (实际这些 feature 都可以找到 golang 专精的组件引入起来,效果 ...
    
			
    3. 
						
  3. 3. ETCD数据备份与恢复
			
    首先为运行在https://127.0.0.1:2379 上的现有etcd实例创建快照并将快照保存到 /srv/data/etcd-snapshot.db. 注:为给定实例创建快照预计能在几秒钟内完成 ...
    
			
    4. 
						
  4. python之Djiango框架简介
			
    基础 # HTTP响应状态码 10X:服务端已经接受到你的数据了 你可以继续提交数据进行下一步操作 20X:请求成功(200) 30X:重定向(301,302) 40X:请求错误(404) 50X:服 ...
    
			
    5. 
						
  5. P10118 『STA - R4』And
			
    P10118 『STA - R4』And 题意:给定 A,B,求 \(\sum y - x\),其中 x,y 满足: x < y x + y = A x & y = B 对于加运算和与运 ...
    
			
    6. 
						
  6. 前端使用 Konva 实现可视化设计器（9）- 另存为SVG
			
    请大家动动小手,给我一个免费的 Star 吧~ 大家如果发现了 Bug,欢迎来提 Issue 哟~ github源码 gitee源码 示例地址 另存为SVG 这一章增强了另存为的能力,实现" ...
    
			
    7. 
						
  7. cesium教程6-用entity绘制点线面label和billboard广告牌
			
     注意:billboard显示的图片是立体的,会跟随角度而变化的. pinBuilder.fromText()用于创建自定义地图图钉 完整示例代码: <!DOCTYPE html> < ...
    
			
    8. 
						
  8. python openstacksdk
			
    调用方法 参考地址 https://github.com/openstack/openstacksdk 注意事项 1.需要安装openstacksdk.我这里装的好像是1.5版本的.opentask接 ...
    
			
    9. 
						
  9. 基于webapi的websocket聊天室（二）
			
    上一篇 - 基于webapi的websocket聊天室(一) 消息超传缓冲区的问题 在上一篇中我们定义了一个聊天室WebSocketChatRoom.但是每个游客只分配了400个字节的发言缓冲区,大概 ...
    
			
    10. 
						
  10. Istio(六)：Istio弹性(超时&重试)和故障注入
			
    目录 一.模块概览 二.系统环境 三.弹性(超时&重试) 3.1 弹性 四.故障注入 4.1 故障注入 五.实战:观察错误注入 5.1 在 Grafana.Zipkin 和 Kiali 中观察 ...
    
			
    11.