我在为我的 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
中链接到所有这些?
感谢您的帮助。
最佳答案
有很多事情可能是个问题:
您的字体文件实际存储在哪里?
如果它们在 /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 文件中——来自 front-squirrel 的渲染字体将在它们附带的 stylesheet.css
中包含相关代码
您只需要将样式表中的引用更改为您自己的应用程序,并将代码包含在您自己的.css
文件中
关于ruby-on-rails - 在我的 Rails 应用程序中包含来自 font squirrel 的字体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19761009/