大家好,我是 JavaPub。
只需一行代码,轻轻一点就可以把任意网站变成暗黑模式。
image
首先我们先做一个实验,在任意网站中,打开浏览器开发者工具(F12),在 C1onsole
控制台输入如下代码并回车:
document.documentElement.style.filter='invert(85%) hue-rotate(180deg)'
image
神奇的事情发生了,当前打开的网站变成了暗黑模式。
*原理解释
- document.documentElement 获取文档对象的根元素,即元素
- 给html元素的.style样式添加filter滤镜样式为invert(85%) hue-rotate(180deg)
- invert() 反转图像。
- hue-rotate()色相旋转。
更多滤镜知识:filter (opens new window)。https://developer.mozilla.org/zh-CN/docs/Web/CSS/filter
为了更方便实用,达到轻轻一点就可以对网页施加魔法
标签:hue,rotate,180deg,代码,一行,filter,invert,任意,modeIndex From: https://blog.51cto.com/wangshiyu/8398146