教你一招如何让网页变成灰色？

在一些特殊时期，很多网站的页面都会不同程度上设置成了灰色。看到这些灰色的网页，开发者们可能会很好奇：网页内容不变的情况下，如何实现整页显示为灰色？

一般方案：CSS 实现网页灰度

CSS 滤镜能实现网页灰色，在页面加入以下 CSS 片段即可让页面显示为灰色。

body {    -webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */    -moz-filter: grayscale(100%);    -ms-filter: grayscale(100%);    -o-filter: grayscale(100%);    filter: grayscale(100%);}

该方案有兼容问题：

1. 不兼容 IE 浏览器，和低版本 Safari 浏览器；
2. 不支持一些直接加载图片链接的场景；

在 IE 浏览器上，文字颜色、背景颜色等可以用 CSS 修改，那图片要怎么处理成灰色呢？

数据万象的灰度图方案

腾讯云数据万象 CI ，支持对存储在 COS 上的图片显示为灰度图。你只需要简单地在 COS 对象链接最后追加 ?imageMogr2/grayscale/1，即可让图片显示为灰色。可以参考数据万象的灰度图具体接口文档说明：（https://cloud.tencent.com/document/product/436/66518）

例如原图：

http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg

加上灰度参数，显示为灰色：

http://examples-1251000004.cos.ap-shanghai.myqcloud.com/sample.jpeg?imageMogr2/grayscale/1

除了灰度图功能，还有丰富的图片处理功能：

腾讯云数据万象 CI （Cloud Infinite，CI）还能实现对 COS 存储桶上的图片、视频、音频、文档等数据的处理，为客户提供专业一体化的数据处理解决方案，涵盖图片处理、媒体处理、内容审核、内容识别、文档处理等功能，满足客户多种场景维度的需求。

其中数据万象的完整图片处理能力如下：

欢迎点击下面小程序，体验数据处理更多功能：

— END —

点击“阅读原文”，了解更多关于数据万象！