最近访客
百度未收录

给浏览器增加夜间暗黑模式

实用技巧:只需一行代码,轻轻一点就可以把任意网站变成暗黑模式。

给浏览器增加夜间暗黑模式-狐狸库

首先我们先做一个实验,在任意网站中,打开浏览器开发者工具(F12),在Console控制台输入如下代码并回车:

document.documentElement.style.filter='invert(85%) hue-rotate(180deg)'

神奇的事情发生了,当前打开的网站变成了暗黑模式。

  1. document.documentElement 获取文档对象的根元素,即<html>元素
  2. html元素的.style样式添加filter滤镜样式为invert(85%) hue-rotate(180deg)
  3. invert() 反转图像。
  4. hue-rotate()色相旋转。

更多滤镜知识:filter

为了更方便实用,达到轻轻一点就可以对网页施加魔法🎉,

我们对代码做了一点点改动。(修正了滤镜对图片等元素的影响)

然后打开浏览器书签管理器,添加新书签,在网址栏粘贴这段代码并保存:

给浏览器增加夜间暗黑模式-狐狸库

以后在任意网站,只需要轻轻一点切换模式书签就可以让它变成85%的暗黑,再点一次就是100%的暗黑,再点一次变回正常模式。

给浏览器增加夜间暗黑模式-狐狸库

来源:详情

温馨提示:本文最后更新于2024/05/08 21:54:10。若文章内容或图片失效,请留言联系站长反馈!
!
也想出现在这里? 联系我们
创意广告
© 版权声明
THE END
点赞0赞赏 分享
评论 抢沙发

请登录后发表评论

    请登录后查看评论内容