如何链接从CSS的.ttf字体在轨道? [英] How to link .ttf font from css in rails?

查看:177
本文介绍了如何链接从CSS的.ttf字体在轨道?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在我的rails项目中有一个自定义字体(/app/assets/fonts/font.ttf)。这个文件夹实际上包含在轨道中吗?



如何在我的css中链接它?我尝试了一些东西,但没有工作(字体,font.ttf,文件的完整路径等)。我已经在rails文档中看过,但是我没有找到这方面的介绍。

解决方案

{app | lib | vendor} / assets应该可以通过资产管道获得。您是否尝试了 http://my.server/assets/font.ttf ? (所有的资产文件,无论/ assets下的子目录结构都可以从/ assets / {filename}得到。例如



请注意,您可以使用sass或erb来生成样式表(if你的样式表被命名为style.css.sass或style.css.erb,那么资产管道将首先运行sass / erb解析器)然后有一个助手可用,参见资产管道导轨指南

最后,这里是一个实际的例子css @ font-face条目用于我关注的网站

  @ font-face {
fo nt-family:vegurRegular;
src:url('/ assets / vegur-r_0.602-webfont.eot');
src:local('☺'),url('/ assets / vegur-r_0.602-webfont.woff')格式('woff'),url('/ assets / vegur-r_0.602-webfont .ttf')格式('truetype'),url('/ assets / vegur-r_0.602-webfont.svg#webfontlYuAwLPv')format('svg');
font-weight:normal;
font-style:normal;
}

其中字体文件存储在vendor / assets / fonts中


I have a custom font in my rails project (/app/assets/fonts/font.ttf). Is this folder actually included by rails?

How do I have to link it in my css? I tried some stuff but none worked ("font", "font.ttf", the full path to the file, etc). I already looked in the rails documentation but I didn't find where this is talked about..

解决方案

By default anything stored in {app|lib|vendor}/assets should be available through the assets pipeline. have you tried http://my.server/assets/font.ttf ? (All asset files regardless of the subdirectory structure under /assets will be available from /assets/{filename} e.g

Note that you can use sass or erb to help generate your stylesheets (if your stylesheet is named style.css.sass or style.css.erb then the asset pipeline will run the sass/erb parser over the file first) then there's a helper available see the asset pipeline rails guide

Finally here's an actual example of the css @font-face entry used I a site I look after

@font-face {
  font-family: 'vegurRegular';
  src: url('/assets/vegur-r_0.602-webfont.eot');
  src: local('☺'), url('/assets/vegur-r_0.602-webfont.woff') format('woff'), url('/assets/vegur-r_0.602-webfont.ttf') format('truetype'), url('/assets/vegur-r_0.602-webfont.svg#webfontlYuAwLPv') format('svg');
  font-weight: normal;
  font-style: normal;
}

where the font files are stored in vendor/assets/fonts

这篇关于如何链接从CSS的.ttf字体在轨道?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆