web特殊字体引入以及格式转换压缩

局限性：只能用于html文件中的静态文字，原理是按照html里包含了哪些字就生成那些字的字体文件。

特殊字体引入

ttf格式的字体文件放在font文件夹中

 

css引入特殊字体

@font-face {
  font-family: 'PingFang';  
  src: url('../font/PingFang_Regular.eot');
  src: url('../font/PingFang_Regular.eot?#iefix') format('embedded-opentype'),
  url('../font/PingFangSCRegular.woff') format('woff'),
  url('../font/PingFang_Regular.ttf') format('truetype'),
  url('../font/PingFangSCRegular.svg') format('svg');
}

html使用字体

/*使用选择器指定字体*/
.home h1{
    font-family: 'PingFang';
}

 

使用字蛛可将ttf生成css中引入的字体格式文件，官网地址：http://font-spider.org/

npm安装

npm install font-spider -g

运行

font-spider ./index.html