Question

我在使用rails应用程序的字体时遇到问题。我试着听从这篇文章的建议：Using fonts with Rails asset pipeline，但我仍然感到困惑。

我正在尝试添加this font。我创建了一个app/assets/fonts文件夹并添加了字体。我相应地更改了production.rb。

我对宣布我的字体感到困惑：

@font-face {
  font-family: 'Icomoon';
  src:url('icomoon.eot');
  src:url('icomoon.eot?#iefix') format('embedded-opentype'),
    url('icomoon.svg#icomoon') format('svg'),
    url('icomoon.woff') format('woff'),
    url('icomoon.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

这些是我的4个RobotoSlab字体：

RobotoSlab-Bold.ttf
RobotoSlab-Light.ttf
RobotoSlab-Regular.ttf
RobotoSlab-Thin.ttf

他们都有名字中的破折号。那么我该怎么写而不是iconmoon.eot？ RobotoSlab-Regular.ttf或RobotoSlab.ttf？

另外，我对应该在.eot部分处理的地方以及我应该在.ttf部分处理的地方感到困惑。在上面的示例中，.eot部分首先得到解决，然后.ttf部分与所有其他格式一起被解决。但是我的字体的默认扩展名是.ttf，那么这会改变什么吗？

另外，我对我应该包含哪些字体文件感到困惑。 http://www.fontsquirrel.com/上的大多数字体都有多个要下载的字体文件（为了解决粗体和斜体的变化）。你应该在@font-face中链接到所有这些吗？

感谢您的帮助。

Answer 1

有很多问题可能会成为问题：

您的字体文件实际存储在哪里？

如果他们在/assets/fonts，您需要直接引用该路径：

@font-face {
  font-family: 'Icomoon';
  src:url('fonts/icomoon.eot');
  src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
    url('fonts/icomoon.svg#icomoon') format('svg'),
    url('fonts/icomoon.woff') format('woff'),
    url('fonts/icomoon.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

你使用过Font-Squirrel的stylesheet.css吗？

Stylesheet.css包含您刚刚变成@ font-face元素的不同字体的所有代码。你提到你有几种字体没有包含在你的css文件中 - 来自前松鼠的渲染字体将包含随附的stylesheet.css中包含的相关代码

您只需将样式表中的引用更改为您自己的应用，并将代码包含在您自己的.css文件中

在我的rails应用程序中包含font squirrel中的字体

1 个答案: