Windows下,字体的显示总是让人抓狂。抗锯齿效果让汉字显得粗细不均,甚至无法对齐的情况。

为了改善网页的显示效果,可以利用Stylus进行字体的替换

  • Stylus可以在Google的商店下载,由于当前Edge版本插件没有上架,也需要通过Google商店进行安装。
  1. 英文版本比较喜欢JetBrains Mono和Cascadia。

    前者可以在jetbrains官网下载。

    后者可以github微软下载。

  2. Microsoft YaHei UI semibold是中文推荐字体,使用Semibold可以改善过细字体产生的不适感。但是缺点是与网页上的加粗字体难以区分。

  3. FontAwesome和Source Emoji是为了解决淘宝,简书等网站利用符号字体的情况。

    强制修改字体会导致这些网站的导航栏出现不可以识别的乱码。替换成FontAwesome之后,就能正常显示了。

  4. console-output是为了Jenkins等编译网站的特殊情况,如果字体过大,每页显示的内容会收到限制。

    设定为15px后,基本上满足我的显示需求。

  1. .console-output {
  2. font-family: 'JetBrains Mono Regular', 'Cascadia Code' !important;
  3. font-size: 15px;
  4. }
  5. span {
  6. font-family: 'JetBrains Mono Regular', 'Cascadia Code', 'Microsoft YaHei UI semibold';
  7. }
  8. pre,
  9. div,
  10. body,
  11. code,
  12. input,
  13. td,
  14. font,
  15. a,
  16. li {
  17. font-family: 'FontAwesome','Source Emoji', 'JetBrains Mono Regular', 'Microsoft YaHei UI semibold' !important;
  18. }

展示效果如下:

【软件推荐】利用Stylus修改网页显示字体的更多相关文章

  1. 用C#实现修改网页数据

    背景    由于某宝最近升级,导致朋友买的刷单软件不能用了:在又付过钱之后,那个刷单软件供应商竟然捐款跑路了...于是,朋友委托我做一个功能一样的软件.功能    他给我描述的软件功能,是这个样子的: ...

  2. Android系统移植与调试之------->如何修改Android默认字体大小和设置里面字体大小比例

    因为我修改 ro.sf.lcd_density的值,将它从160修改 为120,所以导致整个系统的字体都变得很小.因此需要将整个字体变大,并且在设置-->显示-->字体大小的4个选项的值都 ...

  3. CODESOFT对话框中的显示字体怎么修改

      不同的人其使用软件的视觉习惯是不一样的,直接给大家介绍过如何设置CODESOFT的界面语言,这是一个大范围的界面显示设置.本文,将介绍如何修改CODESOFT对话框显示的字体,以满足自己的视觉习惯 ...

  4. Android之hint提示字体大小修改,显示完全

    Android之hint提示字体大小修改,显示完全 1.工作中遇到一个问题,就是自定义EditText的hint提示在超大字体下会显示不全, 2.然后在网上搜索了一下,在这里记录一下,分享给大家,在此 ...

  5. Windows 10 归档、对于一些问题的解决与软件推荐

    I'm a Windows Insider 最近加入了 Windows Insider 计划,主要目的还是为了体验一下马上(7.29)就要发售的 Windows 10 操作系统. 先简要介绍下 Win ...

  6. 我给女朋友讲编程CSS系列(3) CSS如何设置字体的类型、大小、颜色,如何使用火狐浏览器的Firebug插件查看网页的字体

    一.CSS如何设置字体的类型.大小.颜色 设计网页时,一般设置body的字体,让其他标签继承body的字体,这样设置特别方便,但是标题标签h1到h6和表单标签(input类型)是没有继承body的字体 ...

  7. 【Qt开发】【ARM-Linux开发】 QT在ARM上显示字体的问题

    在PC机上利用QT开发的应用程序在设置字体时,在PC上运行,可根据自己的设置,字体随之变大或变小.而移植到ARM上运行时发现,显示字体与所设置的字体不用,字体普遍偏小.经过上网搜索发现,是环境变量字库 ...

  8. 利用Photoshop修改图片以达到投稿要求

    摘自:http://www.dxy.cn/bbs/thread/8602152#8602152 利用Photoshop修改图片以达到投稿要求 软件版本为Photoshop CS V8.0.1(中文版) ...

  9. 修改美化Matlab字体

    修改美化Matlab字体    MATLAB作为高校理工科类本科生或研究生必不可少的科研工具已经有着很多年的历史,以至于在我们的大学生活里或科研工作中,MATLAB处处闪现着它的身影,给我们带来了不少 ...

随机推荐

  1. SVG namespace & preview bug

    SVG namespace & preview bug error This XML file does not appear to have any style information as ...

  2. Flutter: moor_flutter库,简化sqlite操作

    入门 video moor_flutter 示例代码仓库 install dependencies: ... moor_flutter: dev_dependencies: ... moor_gene ...

  3. JVM Attach实现原理剖析

    本文转载自JVM Attach实现原理剖析 前言 本文旨在从理论上分析JVM 在 Linux 环境下 Attach 操作的前因后果,以及 JVM 为此而设计并实现的解决方案,通过本文,我希望能够讲述清 ...

  4. Kubernetes中分布式存储Rook-Ceph部署快速演练

    最近在项目中有涉及到Kubernetes的分布式存储部分的内容,也抽空多了解了一些.项目主要基于Rook-Ceph运行,考虑到Rook-Ceph部署也不那么简单,官方文档的步骤起点也不算低,因此,在整 ...

  5. 使用Docker创建MongoDb服务

    使用Docker创建MongoDb服务 1.先拉mongodb镜像 docker pull mongodb:4.2.5 2.创建映射目录 创建mongo映射目录,用于存放后面的相关东西. mkdir ...

  6. docker仓库之harbor高可用 (三)

    基于上一篇部署完成了企业级仓库harbor的部署,今天我们来聊聊什么是harbor的高可用 Harbor 支持基于策略的 Docker 镜像复制功能,这类似于 MySQL 的主从同步,其可以实现不同的 ...

  7. 异常控制流(csapp)

    [前言]程序按照一定顺序执行称为控制转移.最简单的是平滑流,跳转.调用和返回等指令会造成平滑流的突变.系统也需要能够对系统状态的变化做出反应,这些系统状态不能被内部程序变量捕获但是,操作系统通过使控制 ...

  8. 翻译:《实用的Python编程》03_05_Main_module

    目录 | 上一节 (3.4 模块) | 下一节 (3.6 设计讨论) 3.5 主模块 本节介绍主程序(主模块)的概念 主函数 在许多编程语言中,存在一个主函数或者主方法的概念. // c / c++ ...

  9. 简单的ssm练手联手项目

    简单的ssm练手联手项目 这是一个简单的ssm整合项目 实现了汽车的品牌,价格,车型的添加 ,修改,删除,所有数据从数据库中拿取 使用到了jsp+mysql+Mybatis+spring+spring ...

  10. MYSQL的replace into

    replace into t(id, update_time) values(1, now()); 或 replace into t(id, update_time) select 1, now(); ...