中文自定义字体的使用

461 阅读1分钟

项目地址

IMOLA官网

1.什么是字蛛?

字蛛是一个中文字体压缩器

2.安装字蛛

npm install font-spider -g

3.使用方式

在 CSS 中使用 WebFont: /声明 WebFont/

@font-face {
  font-family: 'pcfg';
  src: url('../font/pcfg.eot');
  src:
    url('../font/pcfg.eot?#font-spider') format('embedded-opentype'),
    url('../font/pcfg.woff') format('woff'),
    url('../font/pcfg.ttf') format('truetype'),
    url('../font/pcfg.svg') format('svg');
  font-weight: normal;
  font-style: normal;
}

/使用选择器指定字体/

body {
    font-family: 'pcfg';
}

1. @font-face 中的 src 定义的 .ttf 文件必须存在,其余的格式将由工具自动生成

2. 开发阶段请使用相对路径的 CSS 与 WebFont

3.运行 font-spider 命令:

font-spider ./index/*.html

总结:自己在做IMOLA官网的时候用到过中文自定义字体,便把使用心得整理了一下,仅供大家参考。版权归字蛛官网所有。