关于字体编码的一些知识,并带大家制作一套字体。(下)

简介: 关于字体编码的一些知识,并带大家制作一套字体。

方法一:利用iconfont图标库制作字体包


iconfont针对字体原理的一篇文章 点击阅读


  1. 在本地设计好一套字体或者图标,这里以数字字体为例,记得所有图层最后合并一下,然后导出svg格式到本地;

  2. 打开iconfont官网 官网地址,在菜单栏找到资源Resources——我的项目(My Projects)——点右上角创建一个项目;


这里可以定义前缀的样式,比如icon_


image.png



  1. 上传本地设计好的svg格式文件,可批量,去除颜色并提交;



image.png



  1. 上传完可以在项目里看到,如图,每个数字下方有一串字符,这就是上面讲到的数字字符,我们需要做的就是一个个修改好,

image.png


5.鼠标点击单个数字图标,点击编辑,默认是下图这样的


image.png



前面unicode是系统自动生成的,我们只需要在字符里输入对应的数字即可,你会发现前面的Unicode自动变成了38。全部修改完返回看到项目中图片自动生成了「&#x」+16进制的格式,这是和编码表一一对应的。类推,汉字的话也是这样操作。


image.png



6.到这里已经制作完成,直接下载即可。


image.png



方法二:可以用一些在线的自己编辑器直接编辑,之后下载ttf安装包



百度字体编辑器 官网


类似比较多,可以自己尝试一下,主要涉及到基线,字宽,目的是保证直接打出的文字左右间距等整体协调。


image.png

image.png




相关文章
|
2月前
|
存储 数据处理 C++
超级好用的C++实用库之点阵字体
超级好用的C++实用库之点阵字体
67 0
|
Java
关于TrueType字体的gasp技术说明
关于TrueType字体的gasp技术说明
110 0
|
iOS开发
iOS开发 - 同一段文字显示不同颜色和字体
iOS开发 - 同一段文字显示不同颜色和字体
111 0
使用位图字体工具BMFont从图片生成自定义字体
上一篇转了别人的一篇文章,讲了BMFont的基本用法。对BMFont比较陌生的同学请点击这里先去学习:http://blog.csdn.net/keshuiyun/article/details/9960589。
1542 0
html+css实战52-文字-字体
html+css实战52-文字-字体
124 0
html+css实战52-文字-字体
html+css实战51-字体和文本样式
html+css实战51-字体和文本样式
105 0
html+css实战51-字体和文本样式
|
XML 数据格式
关于字体编码的一些知识,并带大家制作一套字体。(上)
关于字体编码的一些知识,并带大家制作一套字体。
关于字体编码的一些知识,并带大家制作一套字体。(上)
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
638 0
Markdown设置字体大小、颜色...,CSDN博客编写设置字体大小、颜色、粗细。字体,文字背景设置。
markdown编辑器(颜色、大小、字体)
我是黑体字 我是微软雅黑 我是楷体 呈现效果 我是黑体字我是微软雅黑我是楷体 浏览器默认值是 3 颜色值 参考:CSDN-markdown编辑器语法——字体、字号与颜色
1704 0