Zurb Foundation 4图标字体设置

Question

希望事情进展顺利。

我目前正在使用Zurb Foundation 4为网站构建html / css原型。我目前只使用Sublime Text 3和互联网浏览器来构建它。我对使用Zurb Foundation Icon套装非常感兴趣，但我目前无法让它们显示出来。虽然我安装了Scout for sass，但我希望继续使用文本编辑器和浏览器来构建这个原型。虽然我能够从Zurb Foundation网站下载图标包，但我不清楚如何将这些文件组织到我当前的项目中。我的项目如下文件夹/文件结构：

• css（包含foundation.css，foundation.min.css，normalize.css）
• img（包含.gitkeep）
• js（包含基础和供应商js文件）
• 的index.html

Zurb Foundation图标带有各种文件类型，包括.css，.eot，.svg，.woff等，包括一个名为“svgs”的文件夹，其中似乎存放了这些图标字体。我试图做以下事情：

1. 将zurb foundation icon font文件夹的内容放入我项目的css
2. html页面上的链接基础图标样式表
3. 在html中我输入了“”以测试图标

虽然面板外壳图标确实略大，但图标没有出现。是否可以在运行和编译sass时使用图标字体？我可以纯粹做它html / css还是我需要宝石和指南针运行？我很习惯使用图标字体和实现，但我只是不确定如何设置它。

有人可以建议一个文件夹结构和简单的说明如何正确地将基础图标包中包含的文件添加到基本的zurb项目（例如从他们的网站下载zurb基础时收到的基本项目）？

提前感谢您，非常感谢您的帮助。

Answer 1

我能够让图标工作。我将基础图标包内容放入一个单独的文件夹中。我实际上没有正确地定位图标。虽然Zurb Foundation示例将示例图标称为常规foundicon-settings，但SVG图标的名称包括fi-clipboard-notes或fi-calendar。我在我的自定义样式表中添加了CSS类，以便我可以通过使用元素的字体大小来快速调整图标的大小。