#1 - 2022-4-15 14:25
posthumz (Life, what is it but a dream?)
有些字体真的看着就是一种折磨(中易宋体, arial等等)。经过在网上搜索已经找到能替换大部分网页的大部分字体的方法，但是仍有一些漏网之鱼，不知道大家有没有什么好办法。

先讲一下我的方法：
1. 首先我用了stylus插件，通过类似以下代码已经可以替换掉大部分的字体了。

不过仍有例外：

像这种代码块的地方，可以看见西文字体已经从Courier替换成了Fira Code，但是中文字体依然是SimSun(中易宋体)，即使stylus里面写了
@font-face { font-family: 'SimSun'; src: local('Source Han Serif SC'); }
。虽然不是很懂前端，但是其大概原因是汉字被fallback到了monospace，而monospace的默认中文字体是SimSun，不能使用样式替换掉？以及同理像是sans-serif, serif, system-ui这些保留词都不能替换掉。为了解决这些问题又有了以下方案。
2. (firefox中，其他浏览器不知道有没有对应方法) about:config修改font.name-list.(monospace|sans-serif|serif).(x-western|zh-CN)为想要的字体，layout.css.system-ui.enabled为false。

这样一来对应locale的monospace / sans-serif / serif就都是自己指定的字体了，system-ui则会直接被无视掉。(原本在Windows环境下是Microsoft Yahei UI)

就算这样，仍会有一些离谱的例外：

(BBCode 试验板 明明直接使用了Arial却没有被替换)



(把前面的无关的都删掉了却反而被替换了)



(tahoma - Google 搜索最离谱的，样式中就没有"Tahoma"，about:config中的所有的Tahoma也都换掉了，却还是Tahoma?)



很好奇这些是什么原因？
#2 - 2022-4-15 15:18
烈之斩 (V1046-R MAHORO)
你替换掉的只是font-family: SimSun的情况，所以单独glyph fallback的情况是无效的。
#3 - 2022-4-15 15:33
烈之斩 (V1046-R MAHORO)
删除了回复
#3-1 - 2022-4-15 15:40
烈之斩
删除了回复
#4 - 2022-4-15 16:08
烈之斩 (V1046-R MAHORO)
base
#4-1 - 2022-4-15 16:10
烈之斩
你最后的问题，是因为Helvetica在win下被系统硬编码为Arial的一个alias（或者说Arial是Helvetica的substitute）。你去Stylus把它也替换就行了。或者修改注册表。
参见： https://office-watch.com/2021/wi ... font-for-helvetica/

Tahoma那个也是同理——“MS Shell Dlg 2”= Tahoma

至于为啥是MS Shell Dlg 2，和<input>有关。

<input>、<textarea>等元素是不会继承<body>的font-family的（除非手动指定）。在Fx里，其默认值是MS Shell Dlg 2。

Firefox的dev tool的UI应该有点bug，body的规则既然没有继承，那不应该显示出来（或者应该显示为划掉）。我开启了显示Inspector的选项，显示browser style之后，可以看到那些规则确实被划掉了：



如果真的想改，用font-face改那个字体或者改input的CSS就行
#4-2 - 2022-4-16 07:32
posthumz
烈之斩 说: 你最后的问题，是因为Helvetica在win下被系统硬编码为Arial的一个alias（或者说Arial是Helvetica的substitute）。你去Stylus把它也替换就行了。或者修改注册表...
谢谢，懂了，是windows的锅(bgm38)。所以说这两个属于是特例，用一样的方法替换掉就行了
#4-3 - 2022-4-16 12:18
板砖加身
烈之斩 说: 你最后的问题，是因为Helvetica在win下被系统硬编码为Arial的一个alias（或者说Arial是Helvetica的substitute）。你去Stylus把它也替换就行了。或者修改注册表...

选中元素直接看 Computed 就可以知道用了谁吧。
#4-4 - 2022-4-16 12:59
烈之斩
板砖加身 说:
选中元素直接看 Computed 就可以知道用了谁吧。
是啊，所以我才知道是MS Shell Dlg 2。但是这个MS Shell Dlg 2是哪里出来的并没有显示，即使勾上“浏览器样式”也不显示。



另外我说的BUG是body的font-family明明并不会影响<input>，但是却显示了出来
（虽然现在看来，可能只是input是比body更specific的所以把body给覆盖了；但是在spec里完全找不到对于input的user agent stylesheet的规定。）
#4-5 - 2022-4-16 14:06
板砖加身
烈之斩 说: 是啊，所以我才知道是MS Shell Dlg 2。但是这个MS Shell Dlg 2是哪里出来的并没有显示，即使勾上“浏览器样式”也不显示。



另外我说的BUG是body的font-family...
https://docs.microsoft.com/en-us ... -and-ms-shell-dlg-2
可能是直接选择了 Windows 默认值，但没划掉 body 的样式就不明白怎么回事了。
#4-6 - 2022-4-16 14:18
烈之斩
板砖加身 说: https://docs.microsoft.com/en-us ... -and-ms-shell-dlg-2
可能是直接选择了 Windows 默认值，但没划掉 body 的样式就不明白怎么回事了...
应该是firefox的user agent stylesheet里定义的，在firefox的源代码里可以搜到

开启了Inspector选项里的browser style（不是computed里那个）


其实可以看到font-family有定义，但是很奇怪看不到具体值：


（Chrome也是这样）：


顺便一提<input>在Chrome则是Arial而不是MS Shell Dlg 2
#4-7 - 2022-4-16 14:38
posthumz
烈之斩 说: 应该是firefox的user agent stylesheet里定义的，在firefox的源代码里可以搜到

开启了Inspector选项里的browser style（不是computed里那个...
是不是Mozilla CSS extensions
似乎是一些firefox定义好的值？
#4-8 - 2022-4-16 14:43
posthumz
posthumz 说: 是不是Mozilla CSS extensions
似乎是一些firefox定义好的值？
样式源文件在resource://gre-resources/forms.css
#4-9 - 2022-4-16 14:49
烈之斩
posthumz 说: 样式源文件在resource://gre-resources/forms.css
是的，但是会发现里面并没有MS Shell Dlg 2

我个人理解是有部分值是根据环境动态生成的（比如这个和你的OS有关），所以你在resource里看不见的。

总之可以参见
https://searchfox.org/mozilla-ce ... LookAndFeel.cpp#620
和
https://hg.mozilla.org/releases/mozilla-release/rev/6b931df9c6e1
#4-10 - 2022-4-16 15:03
板砖加身
posthumz 说: 是不是Mozilla CSS extensions
似乎是一些firefox定义好的值？
-moz- 是 fx 对某些样式的自定义扩展。
#4-11 - 2022-4-16 15:07
板砖加身
烈之斩 说: 是的，但是会发现里面并没有MS Shell Dlg 2

我个人理解是有部分值是根据环境动态生成的（比如这个和你的OS有关），所以你在resource里看不见的。

总之可以参见
https://se...
我认为是因为没有定义才回退到了系统默认值，但最终看应用程序对 Shell 字体的选择，就是上面的 MSDN 文档。
#5 - 2022-4-16 08:23
板砖加身 (宅男会虚构虚构老婆倒贴给虚构自己这件事究竟有什么错)
浏览器里直接指定等宽字体为支持中文的等宽字体。
#5-1 - 2022-4-16 09:44
posthumz
也是一个办法，不过主要是想要等宽的西文和中文分别为不同字体。比如指定等宽字体为Fira Code然后指定fallback的中文字体为思源黑体的话是最好的。
#5-2 - 2022-4-16 12:15
板砖加身
posthumz 说: 也是一个办法，不过主要是想要等宽的西文和中文分别为不同字体。比如指定等宽字体为Fira Code然后指定fallback的中文字体为思源黑体的话是最好的。
用 !important 强制覆盖字体？但是最终的 fallback 方案还要看 windows 的设置。
https://bgm.tv/group/topic/364220 这贴聊了一点 font fallback 的事。
#5-3 - 2022-4-16 12:53
posthumz
板砖加身 说: 用 !important 强制覆盖字体？但是最终的 fallback 方案还要看 windows 的设置。
https://bgm.tv/group/topic/364220 这贴聊了一点 font ...
嗯看了一下，在firefox中sans-serif, serif和monospace这些的fallback字体的的确是font.name-list的各项控制的，修改了这些应该大部分字符的fallback没有问题了。
#5-4 - 2022-4-16 12:56
板砖加身
posthumz 说: 嗯看了一下，在firefox中sans-serif, serif和monospace这些的fallback字体的的确是font.name-list的各项控制的，修改了这些应该大部分字符的fallbac...
火狐可以直接指定不同语言的字体，Chromium 加插件也可以。但可能需要 HTML 页面声明所使用的语言。
#5-5 - 2022-4-16 21:03
moratoriumonk
板砖加身 说: 火狐可以直接指定不同语言的字体，Chromium 加插件也可以。但可能需要 HTML 页面声明所使用的语言。
火狐这个功能确实很好，想问一下火狐有没有书签侧边栏的插件，鼠标移到左边单击一下呼出书签栏，有的话就弃用chrome了
#5-6 - 2022-4-17 01:30
posthumz
monatoriumonk 说: 火狐这个功能确实很好，想问一下火狐有没有书签侧边栏的插件，鼠标移到左边单击一下呼出书签栏，有的话就弃用chrome了
火狐原生的的话Ctrl+B可以调出书签侧边栏。
如果想要使用插件的话sidebery可以F1调出；也可以用定制工具栏把扩展的按钮放到左边来单击调出。
#5-7 - 2022-4-17 09:30
moratoriumonk
posthumz 说: 火狐原生的的话Ctrl+B可以调出书签侧边栏。
如果想要使用插件的话sidebery可以F1调出；也可以用定制工具栏把扩展的按钮放到左边来单击调出。
谢谢！很有帮助