前端文字字体颜色（前端特殊字体font处理）
前端文字字体颜色（前端特殊字体font处理）这时文件夹里面多一个.font-spider就是第二张图，里面放的是原字体文件，字体爬过后的文件咱们在项目里面直接使用就行，极大节省文件大小npm install font-spider -g使用方法新建一个文件夹，把需要字体和下面html文件放进去，把特殊的字体都写到body里面<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width initial-scale=1.0" /> <title>Document</title> <s
在移动端开发中，设计在某些地方会使用特殊字体来渲染页面效果，对于前端开发来说，如果使用特殊字体很少，一两处一般都会使用图片处理，在一个大型项目中或者一个多页面活动中所有的文字标题都使用某一个特殊字体，都使用图片肯定不行
1.解决方案 -字蛛（font-spider）在使用之前先看一下字蛛爬过后文件大小变化
压缩效果很明显
2.怎样使用安装好 nodejs，然后执行：
npm install font-spider -g
使用方法
新建一个文件夹，把需要字体和下面html文件放进去，把特殊的字体都写到body里面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width initial-scale=1.0" />
<title>Document</title>
<style>
@font-face {
font-family: "source";
src: url("./Alibaba-PuHuiTi-Medium.ttf");
font-weight: normal;
font-style: normal;
}
body {
font-family: "source";
}
</style>
</head>
<body>
<!-- UI设计的特殊文字都在这里面罗列出来 -->
答 案 邀 请 好 友 成 功 申 请
</body>
</html>
执行字蛛命令：font-spider index.html
这时文件夹里面多一个.font-spider就是第二张图，里面放的是原字体文件，字体爬过后的文件咱们在项目里面直接使用就行，极大节省文件大小
3.字蛛使用说明。https://github.com/aui/font-spider/blob/HEAD/README-ZH-CN.md
