MacOS深色模式下微信文章页面背景变为黑色问题的解决
由于长期伏案,颈椎问题比较严重,所以平时都尽量减少低头看手机的时间,也就养成了用浏览器看各种读物的习惯,其中就包括公众号文章。最近不知道从哪一天开始,突然发现公众号文章的背景突然变成了黑色。
就像这样子:
开始一直以为是不是Chrome插件作祟,但是通过禁用所有插件的方式也没有能够得到恢复。同时,还尝试了一下用其他浏览器,如:Safari。依然有这样的现象发生。
不死心,还是想改回原来的样子,所以就用浏览器审查工具看了看这个页面到底加了啥东西。结果发现这个样式定义:
问题分析:prefers-color-scheme
先来搞懂这个样式是用来做啥的。
prefers-color-scheme
:CSS media feature 用于检测用户的系统主题是浅色或深色。
语法
no-preference
:表示用户未指定操作系统主题。其作为 布尔值 时以false输出。light
:表示用户的操作系统是浅色主题。dark
:表示用户的操作系统是深色主题。
示例
举个例子,快速认识它能用了该做什么?
.day { background: #eee; color: black; }
.night { background: #333; color: white; }@media (prefers-color-scheme: dark) {.day.dark-scheme { background: #333; color: white; }.night.dark-scheme { background: black; color: #ddd; }
}@media (prefers-color-scheme: light) {.day.light-scheme { background: white; color: #555; }.night.light-scheme { background: #eee; color: black; }
}
上面的样式定义了当操作系统处于浅色(light)、深色(dark)两种不同主题情况下,所要采用的不同样式定义。这样前端页面就可以随着用户的系统主题来变更为不同的配色模式,更智能的适配用户的喜好。
所以,这次微信页面背景变为黑色主题,实际上是由于我的MacOS采用了深色主题,而微信文章页面最近做了相关升级,导致我突然获得了与以往不同的展现效果。
如何解决
既然知道了问题原因,那么接下来就来说说如何解决这个问题,把微信文章页面恢复到原来的样式。
当然,最简单的方式就是切换成浅色主题,就可以恢复到原样。但是如果,对于系统主题希望还是以深色模式,但对于浏览器中的页面渲染依然采用浅色主题样式,那要如何实现呢?
下面就来介绍两种方法,帮助大家轻松解决这个问题:
方法一:命令控制
只需要在深色模式主题下,打开终端,执行下面这条命令:
defaults write com.google.Chrome NSRequiresAquaSystemAppearance -bool YES
关闭Chrome并重新打开,就能实现Chrome为浅色主题,而系统与其他应用为深色主题的设置。
如果你要回到原样,可以通过下面命令恢复:
defaults write com.google.Chrome NSRequiresAquaSystemAppearance -bool NO
方法二:软件控制
如果除了Chrome,你还有很多其他应用也要做类似的设置。不论是系统深色主题下的个别应用用浅色主题,还是系统浅色主题下的个别应用用深色主题,都可以用这个应用来轻松设置:Gray。
Gray的使用操作非常简单,只需要轻点应用图标,就能让某个应用在深色主题或浅色主题之间做来回切换。比如,我要设置Chome为浅色主题,其他为深色主题,就可以这样:
如果您下载Gray的网络不方便的话,可以通过关注公众号「程序猿DD」,回复:Gray,直接获取下载链接!
本文首发于http://blog.didispace.com/weixin-post-background-in-macos-dark/
欢迎关注我的公众号:程序猿DD,获得独家整理的学习资源和日常干货推送。
如果您对我的专题内容感兴趣,也可以关注我的博客:didispace.com
MacOS深色模式下微信文章页面背景变为黑色问题的解决相关推荐
- 如何在 macOS 深色模式下,单个应用使用浅色模式
为单个应用关闭"深色"模式,比如 Chrome 浏览器. # 找到 osascript -e 'id of app "Chrome"' # defaults w ...
- gdiplus拼接两张图片_深色模式下的图片变暗问题,解决了!
大家好,我是爱找问题的老沙.微信深色模式刚刚上线时,老沙写了深色模式下图文排版面临的6大问题.这6大问题包括封面图.引导关注.图文样式.全局背景等各个方面,看似已经很全面了,但还是忽略了一个重要元素- ...
- Vue 爬坑之旅 -- history 路由模式下微信分享爬坑总结
现在做 H5 开发,微信平台基本是一个绕不过去的坑,这里面又分为微信授权和微信分享.说它坑,主要提现在以下几个方面: 文档不够清晰详细.开发文档这块是国内所有互联网公司的通病,文档写的不清不楚,长期不 ...
- 解决vue路由hash模式下,微信网页授权问题
解决vue路由hash模式下,微信网页授权问题 本人开发负责微信公众号端,菜单都是自定义菜单,然后每个菜单路径都是经过授权如:http://xxxx.com/ceshi/wechat/authoriz ...
- 开发者模式下微信公众号按钮助手
wechat_menu_assistant 介绍 开发者模式下微信公众号按钮助手,公众号开启开发者模式后,只能通过接口管理按钮,所以开发了这个工具 试用地址 https://pincheche.onl ...
- Android深色模式下,看不见字的解决办法
你去看看,看不见字的那些是不是都没有设置字体颜色! 设置一下字体颜色就好啦! 对于AlertDialog,千万不要用它自己的,要我们自己写好view,然后设置view,不然的话,深色模式下,你是很难修 ...
- 服务商模式下微信小程序支付时,一直报“支付验证签名失败”错误的解决办法
在写小程序支付的时候,我是以服务商模式发起的支付,统一下单接口是调用成功的,但是在小程序调起支付的时候就报"支付验证签名失败"的错误. 主要有三个原因: 1.第二次签名用到的tim ...
- 微信文章页面的实现 http://mp.weixin.qq.com/s?__biz=MjM5MDI3OTAwMg==mid=200337417idx=1sn=5959ed1d722c7da66b
首先在微信后台发送一篇文章,复制文章链接到管理后台 保存到数据库 微信文章页面的实现页面跳转 $notice_list = $db->getAll(" SELECT `title`,` ...
- poi导出图片失真变为红色和图片背景变为黑色
插入图片: private void setPicture(HSSFWorkbook wb, HSSFPatriarch patriarch, String pic, int iRowStart, i ...
最新文章
- node 压缩模块速成
- CRF算法中辅助概念 团 极大团 最大团
- php json_decode 后,数字对象转换成了 科学计数法 的解决方案
- 汇编语言随笔(1)- 初步介绍和寄存器概览
- CV:Win10下深度学习框架安装之Tensorflow/tensorflow_gpu+Cuda+Cudnn(最清楚/最快捷)之详细攻略(图文教程)
- 【Python】函数递归实例之字符串反转、汉诺塔问题分析
- python主线程执行_在Django vi中的主线程中执行Python函数
- LeetCode 1002. 查找常用字符(哈希)
- 面向开发者的机器学习(一)| 机器学习简介
- Spring : Spring Aop CGLIB动态代理调用过程
- C#执行Sql 时,出现“算术运算导致溢出”问题,如何解决?
- java合并后求和_Java8使用stream实现list中对象属性的合并(去重并求和)
- java数据类型转换方向_java基础学习篇02(数据类型转换和基本面试题)
- 7年了,为什么智慧城市还不智慧?
- 如何用计算机扫描图片变成文字,怎样扫描图片文字转换到Word
- Pointer Network指针网络
- JetPack中的Room
- 想准确识别各地方言?这套15000小时方言语音数据推荐了解一下
- 几百字道尽华夏无千年。
- ubuntu控制台访问u盘_虚拟机ubuntu访问u盘