如何添加八位图标作为类似于原子的字体

Question

我如何像添加原子一样添加原子作为字体？

在检查原子代码库时，我发现它们使用的是设置为字体（font-family: 'Octicons Regular'和content: "\f0a4"的八进制图标。我将如何以这种方式将集合实施到我自己的项目中？有公开发布吗？

Answer 1

Octicons Regular 没有可用的CDN，因此您必须拥有自己的WebFontkit。然后，您必须使用@font-face参数添加字体。

请按照以下步骤将自定义字体添加到HTML：-

1。下载Octicons字体：-，可以在link.下载TrueType字体文件格式（.ttf）中使用Octicons Regular字体。

2。创建WebFont工具包：-将下载的（.ttf）文件上传到WebFontkit Generator.。然后下载最佳的WebFontkit。

3。提取字体文件并将其上传到您的托管站点：-编辑 stylesheet.css 文件以更新URL。例如，如果您的网址为www.example.com。因此，更新后的.css文件看起来像：-

@font-face {
font-family: "Octicons";
src: url("https://example.com/css/fonts/Octicons.woff") format("woff"),
url("https://example.com/css/fonts/Octicons.woff2") format("woff2")
}

4。在CSS声明中使用Octicons字体：-在将CSS字体添加到网站后，您可以在CSS声明中使用它。例如，

p {
font-family: Opticons;
font-weight:normal;
font-style:normal;
}