如何用一行代码实现网页变灰效果？
2020年4月4日清明节。我们发现好多网站全部变成黑白的啦。我开始想难道是把页面所有的图片样式什么的修改一下替换吗？那工程量有点大吧？结果今天看到一篇文章介绍到了。我就总结一下吧。
html {-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
就是这样一个filter的属性
filter CSS 属性将模糊或颜色偏移等图形效果应用于元素。滤镜通常用于调整图像，背景和边框的渲染。
filter: grayscale(percent)
将图像转换为灰度图像。值定义转换的比例。percent 值为 100% 则完全转为灰度图像，值为 0% 图像无变化。值在 0% 到 100% 之间，则是效果的线性乘子。
但是他的兼容性。这里除了 IE，其他的 PC、手机端的浏览器都支持了，Firefox 的 PC、安卓端还单独对 SVG 图像加了支持，可以放心使用。
对于ie浏览器只能采取其他的方式了。我看网上说可以采用grayscale.js
需要使用的地方
//选择器可选任何元素、任何你想改变的块或这个页面
//原生js
grayscale(document.getElementById(“gray”));
//或用jq
grayscale($(“body”));
太过爱你忘了你带给我的痛
刺骨的言语ヽ痛彻心扉
不念不忘少年蓝@
蔚落
小灰灰
还没有评论，来说两句吧...