查看图标字体文件中包含哪些图标

Question

我正在开发的项目使用图标字体。有没有办法查看文件中包含哪些图标？我可以在生成的CSS文件中看到这些图标的标签（例如 .icon-mail-alt:before { content: '\e808'; } ），但我想看看这些“图片”是什么样子的。这可能吗？

- Pablo Oliva

Answer 1

如果你使用的是Mac电脑，你可以在字体册中打开它，查看所有可用的字符/符号。

- chroix

---

很遗憾，我正在使用一台个人电脑。请不要评判我；-) - undefined

Answer 2

在电脑上，你可以使用charmap.exe，尽管它几十年来没有太大的改变，而且已经不是那么好用了。快速搜索发现BabelMap是一个更好的选择，看起来更加易用。

- Shaun

Answer 3

图标通常映射到字符范围在0xe000至0xefff之间。 您可以在包含图标字体的页面上打印这些字符。在浏览器控制台中运行：

var fontFamily = 'ICON-FONT-FAMILY';
var range = [0xe000, 0xefff];
var items = [];
for (var i = range[0]; i <= range[1]; i++) {
  items.push('<b class="icon">' + String.fromCodePoint(i) + '</b>');
}
document.body.innerHTML += items.join(' ') + '<style>.icon{font-family: "' + fontFamily + '"; font-size:32px !important; margin: 5px;}</style>';

- Semra