网页字体地址规则
适合谁看:需要自己拼字体 CSS 地址、或批量接入多款字的开发者。
地址格式
https://cn.windfonts.com/fonts-packages/{目录名}/{字重}/{子集}/result.css
| 段 | 怎么填 | 例子 |
|---|---|---|
{目录名} |
字体页网址 app.windfonts.com/fonts/ 后面那一段,全部小写 |
xwwk、syhtsc |
{字重} |
字体页「字重」里列出的名字,大小写照抄 | Regular、Bold、Oblique |
{子集} |
full、zh、zh-common、en 之一 |
full |
例子:
https://cn.windfonts.com/fonts-packages/syhtsc/Bold/full/result.css
大小写要注意
- 目录名一律小写。写成首字母大写可能打不开,也可能打开的是另一份旧文件,不要用。
- 字重名必须和字体页一致。
Regular写成regular会打不开。
四种子集
| 子集 | 包含 | 什么时候用 |
|---|---|---|
full |
字体里的全部字符 | 默认选它。用户内容、生僻字、繁体都能显示 |
zh |
中文字符 | 页面基本是中文,想少一些分片 |
zh-common |
常用中文字 | 文案固定、没有生僻字的页面 |
en |
西文字符 | 只给英文、数字用 |
只有 full 每款字都有。 其他三种有的字没有,地址会返回 404。用之前先在浏览器打开确认一下。
zh、zh-common、en 里没有的字,浏览器会用你写的备用字体显示,所以一定要写备用字体。
跨域和缓存
CSS 和字体分片都允许跨域引用,可以直接放在任何网站上。CSS 和分片文件都带缓存头,回访时不会重复下载。
字体页「获取代码」
字体页「获取代码」会给出一段可复制的代码。复制后请先在浏览器里打开代码里的 CSS 地址:能打开就用;打不开就按上面的格式自己拼地址。
接下来读什么
- 《在 CSS 里使用:字体名、备用字体和多字重》
- 子集为什么能省流量:《中文网页字体为什么要拆分子集》