来自 http://fontello.com 的自定义字体中字形的 CharCodes

Question

如何找到自定义字体中字形的 charCode？

对于一个轻量级网站，我使用 http://fontello.com 创建了一个自定义字体，其中仅包含我需要的 FontAwesome 中的 5 个图标。我希望用这些来替换我在开发过程中一直使用的完整 FontAwesome 集合中的字符。

为了节省带宽，我不想包含标准的 fontawesome CSS 文件：我想要严格的最小值。

以下是我使用 FontAwesome 的方式：

HTML:

<p class="info"> — an (i) for Info icon should appear at the beginning of this line</p>

CSS:

.info::before {
font-family:FontAwesome;
padding: 0 0.5em 0 0;
content: "\f05a"; /* (i) icon */
}

.svg 版本的 FontAwesome 大小为 253 KB。我的 5 字形 .svg 字体重量不到 3 KB，因此节省的带宽相当可观。

但是，(i) 字形不在我的自定义字体中的“\f05a”位置，也不在字符 012345、ABCDE 或 abcde 中。我想将 CSS 规则更改为如下内容：

CSS:

.info::before {
font-family:Font5some;
padding: 0 0.5em 0 0;
content: "\xxxx"; /* (i) icon */
}

如何发现要使用哪些十六进制数字而不是 \xxxx？

Answer 1

当您在 Fontello.com 上创建字体时，在页面顶部 "Select Icons" 旁边，您会看到 "Customize Codes"。您可以在那里查看和自定义您的字体代码，或者，您可以在您的 Fontello demo.html 文件.

中找到这些代码

Answer 2

只需在文本编辑器中打开 SVG 文件即可；代码将在那里，例如：
字形 unicode=""

CharCodes for glyphs in a custom font from http://fontello.com