niapp项目里面要做按钮 ，下载了几个按钮图标之后，想弄成灰色禁用效果，作为手越高、人越懒信念的坚定支持者，懒得再去下载灰色图标了，直接CSS搜起，发现了方便的办法。

实例

随便找点儿图片：

使用此句可以全部变灰。

filter: grayscale(1)

如果是grayscal(0.5)?

只有一点儿颜色，半灰是也，如同加了个滤镜。

filter：n. 过滤器；滤光器，滤声器，滤波器；过滤程序，过滤软件；（指示车辆转弯的）分流指示灯 v. 过滤；渗入，透过；（消息、信息等）慢慢传开，走漏；缓慢进入，陆续步入；（车辆）看到分流指示灯的信号后转弯；（程序）筛选。

uniapp项目中的运用

放在自己项目里面，直接使用动态class搞定。

了纪念一些影响力很大的伟人逝世或者重要的纪念日的时候需要让网页全部变灰来表示我们对逝者的悼念。

其实这个功能很简单，只需要在HTML 的head标签里加入如下代码即可。

<style type="text/css">

html {

filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

-webkit-filter: grayscale(100%);}

</style>

这里实现的是让网页整体变灰，无论网站的头部、尾部或者侧边栏分离都可以实现效果。网上有很多方法，多数都是通过CSS的滤镜来控制页面的显示而已，唯一不同的就CSS代码调用的方式而已。

很早以前想着一个网站那么多的图片、手动处理后替换是一个工作量异常繁复的事，然而事情当然没有这么简单，仅需几行代码即可轻松完成。

最后附上已故伟人的一首词，沉痛哀悼深切缅怀...

《满江红·江上青百年诞辰祭》

自古英雄，凭苍宇、江山点索。

酬壮志、铁窗寒彻，泮池磅礴。

史岭红梅花沥血，芦沟晓月天飞鹤。

擎玉虹，魑魅冷相看，惊魂魄。

歌颍上，旗旆烁。驱稔寇，飙尘恶。

诉声声杜宇，孛星凋落。

春水绿杨风曼暖，秋山红叶日彰灼。

清明日、持酒告先灵，神州跃。