背景:項目開發(fā)中膳叨,遇到ttf字體過大,需要按照使用到的文字進行裁剪痘系,從而減少字體包的大小菲嘴。
使用場景:web前端 ,cocos creator 汰翠, java
方案一:java中使用sfnttool.jar 抽取指定中文字符串ttf文件
一龄坪、準(zhǔn)備java運行環(huán)境,并下載sfnttool.jar文件
鏈接: https://pan.baidu.com/s/17IOWBq5C2ta2Z1tPzrkuVA 提取碼: hxcm
二复唤、運行命令
java -jar sfnttool.jar文件路徑 -s '字體內(nèi)容' 原始ttf文件路徑 裁剪后ttf文件路徑
三健田、最終生成裁剪后的ttf文件。
這個方案在cocos creator中使用時佛纫,部分字體文件無法識別加載妓局,推薦方案二总放。
方案二:利用nodeJs插件font-spider,抽取指定中文字符串ttf文件
一好爬、安裝nodeJs運行環(huán)境局雄,并下載安裝字蛛font-spider
npm install font-spider -g
二、使用方法
1.創(chuàng)建font.css,引入需要用到的字體存炮,定義好font-famaily炬搭,并在下方定義好需要用到的id名,方便后面改變字體直接使用
font.css
@font-face {
font-family: 'kaiti';
src: url('kaiti.ttf') format('truetype');
}
#txt{
font-family: 'kaiti';
}
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>文字過濾</title>
<link rel="stylesheet" href="./css/font.css">
</head>
<body>
<div id="txt">
部首結(jié)構(gòu)筆畫數(shù)易錯點書寫要點::
</div>
</body>
</html>
三僵蛛、終端輸入命令尚蝌,提取需要的字體
font-spider ./index.html