windows自带的字体是有版权的,包括微软雅黑(方正)、宋体(中易)、黑体(中易)等
版权算是个大坑,所谓为了避免版权问题,全部使用开源字体即可
我这里选择的是思源宋体,有两种加载方式
一、在线调用方式
google在线字体服务是没被屏蔽的,可以用。
但是选取字体的页面是不稳定的访问:google font链接
1.搜索Noto Serif SC
2.获取使用方式
3.
4.浏览器处理
引用处引用
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@200..900&display=swap" rel="stylesheet">
具体内容处引用
body{
font-family: "Noto Serif SC", serif;
}
二、本地调用方式
1.下载文件到项目目录
比如我放到/modules/font目录下
2.引用字体
html的css sytle中写入
font-family: 'Source Han Sans';
src: url('/modules/font/SourceHanSerifCN-Regular-1.otf') format('opentype');
font-weight: normal;
font-style: normal;
然后再调用,比如body。后面的serif是如果加载失败用默认的字体
body{
font-family: "Source Han Sans", serif;
}
3.加载速度优化
因为一个字体文件10来兆,加载速度慢,可以用cdn加速或者在线加载方式