从自定义字体中获取Unicode图标值

Question

我需要为使用flaticon制作的图标字体编写CSS。我使用Mac 10.10进行开发，找不到任何检索所需Unicode值的单个字符的方法，这些值需要插入我的CSS中。

.font-icon-pencil:before {
    content: "\e038";
}

我怎样读取字体文件的内容，以获取自定义字体中的图标代码？

- al404IT

---

字体系列：font-awesome; - Benjamin

字体系列是“MyFont”，但实际上并不重要，在CSS中，我需要为每个图标创建一个具有特定字符Unicode值的特定类，我猜它们从001、002等开始。 - al404IT

@al404IT 已经生效了吗？ - Omar

Answer 1

在MacOS Sierra操作系统中，我可以在默认应用程序Font Book中获取图标的Unicode值。

1. 安装字体。
2. 在Font Book中打开用户安装的字体。
3. 将鼠标移动到所需图标上。您会在悬停时得到一个标题，显示该图标的Unicode值。

- Micer

---

请确保您在工具栏中点击网格图标，因为默认情况下会选择第一个图标，导致悬停效果一开始无法正常运作。 - timiscoding

那 Windows 怎么样？ - Jono

@Jonathan，抱歉我不知道，这个问题是关于MacOS的。 - Micer

对于Windows系统，您可以使用系统程序“字符映射器”@Jonathan。据我回忆，您需要在该程序中打开一个菜单选项才能查看Unicode值。 - Matty J

Answer 2

https://fontdrop.info ：非常有用的网站，可以一次性查看所有的Unicode代码。

- warfish

---

这是唯一能读取我拥有的ttf文件的解决方案，非常感谢。 - adam

这就是最终对我起作用的东西。 - E Benzle

Answer 3

编辑回答（2015年4月29日）

@al404it 评论道：“我知道如何编写CSS部分，但不知道如何从自定义字体中获取相应的代码以在内容中使用：“xxxxx”；”

---

回答

选项1）
Font Viewer或类似的字体查看器软件
这是最简单的选择。

1. 安装FontViewer软件
2. 从字符映射中获取字体图标代码
3. 使用任何在线代码转换器，例如Rishida Unicode Code Converter，获取转义后的CSS代码

如果这对您不起作用...

选项2）
使用icomoon应用程序

1. 注册并创建新项目
2. 在该项目中导入您的字体文件（左上角的“+导入图标”按钮）
3. 在“字体”（右下选项）下，您将看到所有图标及其相应代码的列表。

这肯定会起作用。

---

原始答案

@font-face {
    font-family: icons;
    src: url(MyFont.ttf); /* Replace with thatever your font file is */
}
.font-icon-pencil:before {
    font-family: icons, sans-serif;;
    content: "\e038";
}

- Omar

---

我知道如何编写CSS部分，但不知道如何从自定义字体中获取相应的代码以在内容中使用："xxxxx"。 - al404IT

@al404IT 在我寻找答案的同时，我建议您编辑您的问题并开始悬赏。这是因为您的问题不够清晰，无法确定您真正想要什么（从字体文件中获取“CSS内容”代码）。 - Omar

通过字体查看器，我无法在字符映射下看到任何有关字符的信息。使用第二种方法，我可以导入我的字体，它是一个.ttf文件，它说：“请选择由IcoMoon导出的SVG图像、SVG字体或JSON。” - al404IT