转载 http://www.cnblogs.com/Kummy/p/4442142.html
??以前还不知道这种办法的时候,如果要在网页中显示特殊中文字体的话,需要导入整个全部的.ttf字体文件,而文件高达好几兆,根本是不可取的,偶然间看到以上链接的文章,新的思路新的方法,将网页中需要用特殊字体的中文文字,进行打包压缩。
1.安装font-spider
npm install font-spider -g
2.在css中使用webfont
@font-face{
font-family: ‘pinghei‘;
src: url(‘../font/pinghei.eot‘);
src:
url(‘../font/pinghei.eot?#font-spider‘) format(‘embedded-opentype‘),
url(‘../font/pinghei.woff‘) format(‘woff‘),
url(‘../font/pinghei.ttf‘) format(‘truetype‘),
url(‘../font/pinghei.svg‘) format(‘svg‘);
font-weight: normal;
font-style: normal;
}
// 指定字体并使用
.pinghei {
font-family: ‘pinghei‘;
}
// ../font 都是相对路径,看文件相对位置
// 其中.ttf文件是必须要有的,根据设计稿的字体在网上下载对应的.ttf文件,其他都是生成的
3.运行font-spider命令
font-spider *.html
4.温馨提示
运行font-spider命令后,会自动生成相关文件,而其中的字体只包括只包括只包括页面中出现并引用字体的文字,如果后面新增了其他文字,需要重新运行命令
原文地址:https://www.cnblogs.com/shenmissing/p/9037288.html
时间: 2024-10-01 11:48:06