可直接删除上方字符并输入预览。
语种预览
简体中文
拉丁字母
阿拉伯数字
授权范围
字体使用非正式法律许可授权,由 版权方(设计师) 自定义条款(tsanger.cn)。
嵌入字体
常规的引入方式,使用 CSS 或 <style> 。
@import url("https://fontsapi.zeoseven.com/479/main/result.css"); body { font-family: "TsangerYuMo W03"; font-weight: normal; }
使用 HTML 实现标准的预载和冗余措施。
<link rel="preconnect" href="https://fontsapi.zeoseven.com" crossorigin /> <link rel="stylesheet" href="https://fontsapi.zeoseven.com/479/main/result.css" onerror="this.href='https://fontsapi-storage.zeoseven.com/479/main/result.css'" /> <style> body { font-family: "TsangerYuMo W03"; font-weight: normal; } </style>
在加载空闲时预取,完成后转为 stylesheet ,实现无阻塞渲染和冗余措施。
<link rel="preload" as="style" crossorigin href="https://fontsapi.zeoseven.com/479/main/result.css" onload="this.rel='stylesheet'" onerror="this.href='https://fontsapi-storage.zeoseven.com/479/main/result.css'" /> <noscript> <link rel="stylesheet" href="https://fontsapi.zeoseven.com/479/main/result.css" /> </noscript> <style> body { font-family: "TsangerYuMo W03"; font-weight: normal; } </style>
使用 JS 引入字体实现无阻塞渲染和冗余措施,适合 React / Vue3 等客户端路由场景。
/* * ZSFT 冗余器 Version 3.1 (LICENSE: MIT, by 秋, zeoseven.com) * L1 不可用时由 L2 提供文件,使用 fetch HEAD 已确保框架兼容性 * ECMAScript 2015+ (ES6+) */ const __zsftCss = `body { font-family: "TsangerYuMo W03", system-ui, sans-serif }`; // 可以将 __zsftCss 删除变为 undefined ,因为它实际上就是在 head 插入 style ,删除后在其它位置定义正确的 font-family 即可。 ((z, s, f, t) => { setTimeout(()=>{ z=document.head;if(typeof __zsftCss!='undefined')z.insertBefore(document.createElement("style"),(z.firstChild)).innerHTML=__zsftCss; f=(i)=>{return "https://static"+i+"zeoseven.com/zsft/519/main/result.css";}; t=(i)=>{const t=document.createElement("link");t.rel="stylesheet";t.href=i;t.onerror=()=>z.removeChild(t);z.insertBefore(t,(z.firstChild));}; const o=f(s),u=f("-host."); try{fetch(o,{method:"HEAD"}).then(r=>r.status>299?t(u):t(o)).catch(t(u));}catch{t(u)}; }); })(0,".");
让大体积字体像英文字体一样,只需要加载 10KB 左右的文件。
/* * ZSFT 英文子集化选项 * AaBbCcDdEeFfGgHhIiJjKkLlMmNnOoPpQqRrSsTtUuVvWwXxYyZz1234567890 ,.!?:;- */ @font-face { font-family: "zsft-enmin-479"; src: url("https://fontsapi.zeoseven.com/479/main.woff2") format('woff2'), url("https://fontsapi-storage.zeoseven.com/479/main.woff2") format('woff2'); unicode-range: U+0061-007A, U+0041-005A, U+0030-0039, U+002E, U+002C, U+0021, U+003F, U+003A, U+003B, U+002D; } body { font-family: "zsft-enmin-479"; font-weight: normal; }
有时候,其它字重的 font-family 与默认不同,需要根据 CSS 地址中的 font-family 属性来正确引入字体。
Regular https://fontsapi.zeoseven.com/479/main/result.css W01 https://fontsapi.zeoseven.com/479/w01/result.css W02 https://fontsapi.zeoseven.com/479/w02/result.css W04 https://fontsapi.zeoseven.com/479/w04/result.css W05 https://fontsapi.zeoseven.com/479/w05/result.css
感到困惑?我们提供了 帮助与支持 其中的 嵌入字体的方法 以及关于 违法违规内容的定义和处理措施。
仓耳与墨
由 仓耳屏显字库 设计的支持但不限于 简体中文 和 拉丁字母(英文) 的 Sans Serif / 无衬线 风格的开放字体。
许可协议
字体以 作者声明 的方式授权, 查看授权范围。 ZSFT 确保它可以直接应用在 WebFonts 场景。 可前往 tsanger.cn 查阅授权的详细限制、条件和许可。
字体预览
现在显示的,就是字体的字型,不过当前字体无法显示的字符会使用设备默认字体 ... ZSFT 将字体直接设置在介绍文字中以展示实际使用的效果,当然 ZSFT 也提供更好的 字体预览器。
版本
当前显示和位于 CDN 中的字体版本是 Version 1.000 ,可前往字体的源发行/分发网站 tsanger.cn 上查阅,如果发现字体有新的版本, 可以 一键提醒更新 ~ 或 使用邮件详细说明 ~ 来在 ZSFT 的 CDN 中使用更新版本。
下载
不论在什么情况下,都建议在 源发行/分发网站 中获取字体文件,因为那里提供的文件通常是最权威、最新且最安全的。
源发行/分发网站
可前往字体的源发行网站 https://tsanger.cn/product/191 上查阅字体的更多权威资讯, ZSFT 也是在那里得到的字体文件和信息 ~
fonts.zeoseven.com/items/479
随机推荐
简体中文
拉丁字母
繁体中文
日文
韩文