落霞孤鹜字体是一款优美的开源字体,适合用于博客等网站。由于字体文件较大,可能会消耗较多的CDN流量。不过,通过BootCDN提供的免费CDN服务,可以方便地使用该字体而无需担心流量问题。只需在HTML中引入BootCDN上的字体样式文件,并设置字体家族,即可在网站上使用落霞孤鹜字体。BootCDN提供了不同版本的字体,可根据需求选择合适的版本。
原本说好不再折腾博客字体的,今天在使用阿里巴巴的矢量图标库的时候,下面那个轮播图海报“阿里妈妈·智造体”又让我开始手痒了。点进去看看,里面都是阿里那边的一些开源字体,耐不住好奇心的我就去试了试,发现并不好看。另外一个原因就是字体文件真大啊,至少都是2MB左右的大小,实在有点太烧CDN的流量了。虽然之前写了一篇压缩字体的文章(见文《字体文件太大怎么办?使用Python库fonttools大幅度压缩字体的大小,实现字体几百KB大小》),但是越来越懒的就是不想再去操作这些东西。于是我就又探索了一波,最终还确实发现了不错的字体,最重要的是不要花自己的CDN的流量。
霞鹜文楷个人觉得特别适合博客类网站,其实具体也分很多细分:
BootCDN是Bootstrap 中文网支持并维护的前端开源项目免费 CDN 服务,致力于为 Bootstrap、jQuery、Angular、Vuejs 一样优秀的前端开源项目提供稳定、快速的免费 CDN 加速服务。
字体库网站链接:BootCDN - lxgw-wenkai-webfont
需要说明的是,小陶个人比较喜欢霞鹜文楷屏幕阅读版,加粗后的「霞鹜文楷」与 Segoe UI Regular 粗细相当,PC 和 Android 手机屏幕阅读更加舒适。如果需要别的版本,可以在BootCDN的字体库找找改改就行。
首先,引入css文件:
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/lxgw-wenkai-screen-webfont/1.7.0/style.min.css" />
如果是handsome主题,可以添加到自定义输出head 头部的HTML代码:
然后添加一个CSS应用网站里即可:
body {
font-family: "LXGW WenKai Screen", sans-serif;
}
如果是handsome主题,把这个代码放到自定义CSS中:
最后的效果如我的网站所示(2024.04.18,后面可能又折腾别的去了)