css - 在 Ruby on Rails 中使用@font-face？

Question

我正在尝试在 Rails 中包含我的自定义字体。

我的文件字体在 app/assets/fonts/ 中。

我编辑了 CSS:

# in app/assets/stylesheets/application.css

@font-face {
  font-family: 'fontello';
  src: url('fonts/fontello.eot');
  src: url('fonts/fontello.eot#iefix')format('embedded-opentype'),
       url('fonts/fontello.woff') format('woff'),
       url('fonts/fontello.ttf') format('truetype');
}

我也尝试更改路径 url('assets/fonts/fontello.eot'); url('fontello.eot');。

我编辑了配置:

# in config/application.rb

require File.expand_path('../boot', __FILE__)
require 'rails/all'

Bundler.require(:default, Rails.env)

module Gui
  class Application < Rails::Application
    config.assets.paths << Rails.root.join('app', 'assets', 'fonts')
  end
end

但它不起作用。

我使用 Rails 4.0.2。

Answer 1

您需要使用 asset_path 才能在 css 文件中使用 Assets (将 erb 扩展名添加到您的 application.css 文件，然后 asset_path 在您的 CSS 规则中可用)

@font-face {
  font-family: 'fontello';
  src: url('<%= asset_path("fontello.eot") %>');
  src: url('<%= asset_path("fontello.eot#iefix") %>') format('embedded-opentype'),
       url('<%= asset_path("fontello.woff") %>') format('woff'),
       url('<%= asset_path("fontello.ttf") %>') format('truetype');
}