【问题标题】:Rails 4, @font-face, sass, assets?Rails 4、@font-face、sass、资产?
【发布时间】:2013-11-09 03:42:50
【问题描述】:

我知道已经有关于@font-face、sass 和 rails 4 的问题,但我想看看是否有人能够让它工作。

我的 Sass 文件如下所示:

@font-face{ font-family:"FrutigerNextW01-Regular";
src:    url(font-path("4cef6d85-d22a-4541-b469-da13751862aa.eot?#iefix"));
src:    url(font-path("4cef6d85-d22a-4541-b469-da13751862aa.eot?#iefix")) format("eot"),
        url(font-path("d74de079-587d-4049-9cca-50ba02a536f9.woff")) format("woff"),
        url(font-path("07749504-e72d-4fc9-a58d-5b853dd51fc7.ttf")) format("truetype"),
        url(font-path("8178e4eb-8ce0-4c15-a701-4a102b204c0e.svg#8178e4eb-8ce0-4c15-a701-4a102b204c0e")) format("svg");
}

我尝试过使用 erb 标签、资产路径和我能找到的所有其他配置。

我在 application.rb 文件中尝试了这两行

config.assets.paths << "#{Rails.root}/app/assets/fonts"

config.assets.paths << Rails.root.join('app', 'assets', 'fonts')

我做错了吗?我知道有些人已经能够让这个配置工作,但它不适合我!

【问题讨论】:

  • 感谢您的提问。我也在寻找同样的东西。
  • Rails 3.x 应用程序是否可以使用相同的功能,而不是 4.x ?

标签: ruby-on-rails-4 sass asset-pipeline font-face


【解决方案1】:

我有一个 Rails 3.2 应用程序,其网络字体可以正常工作。

它们存储在app/assets/fonts 中,并使用asset_path() 方法(而不是font_path())从我的ERB 视图中引用。

这是我的内联样式标签的副本:

<style type="text/css">
  @font-face {
    font-family: 'QuicksandBook';
    src: url('<%= asset_path('Quicksand_Book-webfont.eot') %>');
    src: local('☺'), url('<%= asset_path('Quicksand_Book-webfont.woff') %>') format('woff'), url('<%= asset_path('Quicksand_Book-webfont.ttf') %>') format('truetype'), url('<%= asset_path('Quicksand_Book-webfont.svg') %>') format('svg');
    font-weight: normal;
    font-style: normal;
  }
  @font-face {
    font-family: 'QuicksandBold';
    src: url('<%= asset_path('Quicksand_Bold-webfont.eot') %>');
    src: local('☺'), url('<%= asset_path('Quicksand_Bold-webfont.woff') %>') format('woff'), url('<%= asset_path('Quicksand_Bold-webfont.ttf') %>') format('truetype'), url('<%= asset_path('Quicksand_Bold-webfont.svg') %>') format('svg');
    font-weight: bold;
    font-style: normal;
  }
</style>

【讨论】:

    猜你喜欢
    • 2010-12-06
    • 1970-01-01
    • 1970-01-01
    • 2012-09-24
    • 1970-01-01
    • 1970-01-01
    • 2012-06-30
    • 2017-05-21
    • 2020-09-16
    相关资源
    最近更新 更多