在head标签里
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/style.css" />
<style>
body {
/* TC version */
font-family: "LXGW WenKai TC", sans-serif;
}
</style>
这样标题无法完全适配
或许是因为在线获取到css中的字体不全？
我是将LXGW Wenkai TC下载到本地，复制到/Users/joomaen/Library/Fonts路径
然后只在Planet的自定义代码中写入<style>部分即可。
<style>
body {
/* TC version */
font-family: "LXGW WenKai TC", sans-serif;
}
</style>
上述方法还是有问题，只能在本地显示，浏览器上无法正常显示。忘记考虑到这一点，毕竟没有把字体文件上传。
于是我在AI的帮助下，自建了一个GitHub仓库用来存放字体，我用的是LXGW Wenkai TC 霞鹜文楷旧字形版。
- 将字体文件上传到仓库中
fonts文件夹 - 在仓库根目录新建一个
fonts.css文件，内容如下：
/* 定义 Regular 字体 */
@font-face {
font-family: 'LXGW WenKai TC';
src: url('https://raw.githubusercontent.com/urkbio/my-fonts/main/fonts/LXGWWenKaiMonoTC-Regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
/* 定义 Bold 字体 */
@font-face {
font-family: 'LXGW WenKai TC';
src: url('https://raw.githubusercontent.com/urkbio/my-fonts/main/fonts/LXGWWenKaiMonoTC-Medium.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
我这里只用了一种，你可以设置多种粗细。
- 在Planet自定义CSS中引用，添加到
<head>,代码如下：
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/urkbio/my-fonts@latest/fonts.css" />
<style>
body {
/* TC version */
font-family: "LXGW WenKai TC", sans-serif;
}
</style>
在使用jsDelivr时用@latest以获取最新内容！