一日一技 | 利用油猴插件自定义网页显示字体

浏览器打开网页的字体,可以通过安装油猴插件的方式实现自定义,带来统一的阅读体验。

引言

效果图示例如下。

效果图
效果图

上图左侧,用 Safari 打开百度百科词条页面,默认显示的网页字体是 macOS 中自带的仿宋体。这种字体在 Mac 的屏幕下略显突兀,字体不够美观,与上方表单中显示的平方字体的“宋体”二字也不项映衬。通过添加油猴插件,可以实现右侧图片的显示效果,即网页内所有的字体都统一为苹方字体,界面清爽许多。

具体步骤

  1. 安装适用于浏览器版本的油猴插件
  2. 在脚本源中搜索并安装“强制使用微软雅黑”这款脚本(也可以复制关键代码,新建脚本,储存使用)
  3. 打开字体集,查看想要替换的字体在电脑中的名称
  4. 打开油猴插件,对插件进行编辑,将代码的字体名称部分进行替

脚本中的关键执行代码

// 这里是代码注释区
// 将自定义的字体清单存放在这里
// 方便调用
// Microsoft YaHei
// Source Han Serif CN

// 替换网页字体
(function() {
	changeFont("PingFang SC",1);
})();

这里将强制使用的字体修改为了苹方字体。

注意事项

之后再慢慢摸索时,发现有几个注意事项,这里总结一下:

  • 字体已经安装在了你的 macOS 内
  • 字体的名字不是熟悉的中文,也不一定是字体册内显示的名字,应正确输入字体的代码名字
  • 即使满足前两个要求,也不是所有的字体都能够被支持
  • 一定程度上会影响网页的打开速度

字体清单

这里给一份自用的字体名单,列出名字来方便复制粘贴(记得安装相应自体)。

  • Hiragino Sans GB | 冬青黑体
  • Microsoft Yahei | 微软雅黑
  • PingFang SC | 苹果苹方
  • Source Han Sans | 思源黑体
  • Source Han Serif CN | 思源宋体
  • Courier New | 程序员字
  • Impact | 有趣的字体

可以把常用字体添加到脚本代码上方 // 注释区,方便随时修改。

脚本示例
脚本示例

最后,感谢脚本上传者 BackRunner

从此 Safari 变得多姿多彩,可爱至极

发布了9 篇原创文章 · 获赞 11 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/Code_Tookie/article/details/82764173