背景介绍：
因为项目有涂鸦同步的功能 （ 例如在电脑上画一条直线 需要把这条直线同步到各种端） 所以需要保证h5内容区域在各种设备上都保持一致 众所周知 字体在不同设备平台上 支持程度是不一样的 那么首先需要了解的问题就是字体支持程度。
字体格式的支持程度：
一、TureTpe(.ttf)格式：
.ttf字体是Windows和Mac的最常见的字体，是一种RAW格式，因此他不为网站优化,支持这种字体的浏览器有:
【IE9+,Firefox3.5+,Chrome4+,Safari3+,Opera10+,iOS Mobile Safari4.2+】二、OpenType(.otf)格式：
.otf字体被认为是一种原始的字体格式，其内置在TureType的基础上，所以也提供了更多的功能,支持这种字体的浏览器有:
【Firefox3.5+,Chrome4.0+,Safari3.1+,Opera10.0+,iOS Mobile Safari4.2+】三、Web Open Font Format(.woff)格式:
.woff字体是Web字体中最佳格式，他是一个开放的TrueType/OpenType的压缩版本，同时也支持元数据包的分离,支持这种字体的浏览器有: 【IE9+,Firefox3.5+,Chrome6+,Safari3.6+,Opera11.1+】
四、Embedded Open Type(.eot)格式:
.eot字体是IE专用字体，可以从TrueType创建此格式字体,支持这种字体的浏览器有 【IE4+】
五、SVG(.svg)格式:
.svg字体是基于SVG字体渲染的一种格式,支持这种字体的浏览器有 【Chrome4+,Safari3.1+,Opera10.0+,iOS Mobile Safari3.2+】
解决方案：
-
在@font-face中我们需要以上五种格式的字体来达到更多种浏览版本的支持。 笔者已知的字体工具转换网址：
- https://transfonter.org/
- https://www.fontsquirrel.com/tools/webfont-generator
优点：不依赖第三方。 缺点：字体包资源很大。
-
利用webfont中文解决方案 统一各种端的字体。
优点：动态生成所需字体包，字体资源占用很少。 缺点：依赖第三方。
webfont：
目前国内存在的webfont解决方案：
- 有字库： 有字库是全球第一中文 WebFont 服务平台。
- 阿里妈妈：阿里系的 WebFont 服务平台。
- 就是字： 台湾一家繁体中文 WebFont 服务平台。
- 字蛛（FontSpider）：一款中文字体压缩器，让网页自由引入中文字体成为可能。希望未来有更多更好的中文 WebFont 解决方案。 就是字 台湾一家繁体中文 WebFont 服务平台。
参考资料:
- https://transfonter.org/formats