CSS 从自定义字体中获取 unicode 图标值
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27247145/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Get the unicode icon value from a custom font
提问by al404IT
I need to write a CSS for an icon font build using the site flaticon. I develop using a MAC with 10.10 and can't find any way to retrieve a single character Unicode value that I need to insert inside my CSS
我需要使用站点flaticon为图标字体构建编写 CSS 。我使用 10.10 的 MAC 进行开发,但找不到任何方法来检索需要插入到 CSS 中的单个字符 Unicode 值
.font-icon-pencil:before {
content: "\e038";
}
How can I read the contents of a font file, to get the icon codes within that custom-made font?
如何读取字体文件的内容,以获取该自定义字体中的图标代码?
回答by Micer
On MacOS Sierra I'm able to get a unicode value of icon in Font Book(default app).
在 MacOS Sierra 上,我能够在Font Book(默认应用程序)中获得图标的 unicode 值。
- Install the font.
- Open the user installed font in Font Book.
- Move the mouse on the desired icon. You should get a title saying unicode value on hover.
- 安装字体。
- 在 Font Book 中打开用户安装的字体。
- 将鼠标移动到所需的图标上。你应该得到一个标题,上面写着悬停时的 unicode 值。
回答by Omar
Edited answer (April 29th, 2015)
编辑后的答案(2015 年 4 月 29 日)
@al404it commented: "I know how to write the CSS part. I don't know how to get, from a customized font, the corresponding code to use in content: "xxxxx";"
@al404it 评论说:“我知道如何编写 CSS 部分。我不知道如何从自定义字体中获取内容中使用的相应代码:“xxxxx”;”
Answer
回答
Option 1)
Font Viewer, OR similar font viewer software
This is the easiest option.
选项1)
字体浏览器,或小号imilar字体观众softwarË
这是最简单的选项。
- Install the FontViewer software
- Get the font's icon codes from the character map
- Use any online code converter, like Rishida Unicode Code Converter, to get the escaped CSS code
- 安装FontViewer 软件
- 从字符映射中获取字体的图标代码
- 使用任何在线代码转换器,如Rishida Unicode Code Converter,获取转义的 CSS 代码
If this doesn't work for you...
如果这对您不起作用...
Option 2)
Use the icomoon app
选项 2)
使用icomoon 应用程序
- Sign up AND create a new project
- In that project, import your font files (Top left button called "+ Import Icons")
- Under Fonts (Bottom right option), you'll see the list of all your icons and respective codes.
This should work for sure.
这应该肯定有效。
Original answer
原答案
@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";
}
回答by warfish
https://fontdrop.info: Very useful website where you can see all the unicode codes at once
https://fontdrop.info:非常有用的网站,您可以在其中一次查看所有 unicode 代码