1

我在为我的 rails 应用程序添加字体时遇到问题。我尝试遵循这篇文章中的建议:Using fonts with Rails assets pipeline,但我仍然感到困惑。

我正在尝试添加此字体。我创建了一个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吗?

谢谢您的帮助。

4

1 回答 1

0

There are a number of things which could be a problem:


Where are your font files actually stored?

If they are in /assets/fonts, you need to reference that path directly:

@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;
}

Did you use stylesheet.css from Font-Squirrel?

Stylesheet.css has all the code for the different fonts you've just turned into @font-face elements. You mentioned you have several fonts which are not included in your css file -- the rendered fonts from front-squirrel will have the relevant code contained in the stylesheet.css which comes with them

You just need to change the references in the stylesheet to your own app, and include the code in a .css file of your own

于 2013-11-04T09:16:36.637 回答