将CSS元素加载到Rails应用程序中

时间:2015-08-23 20:31:03

标签: html css ruby-on-rails ruby

我在Rails应用程序中创建了一个欢迎文件夹,用于存放根指向它的index.html.erb文件,并且我已完成所有HTML和CSS,但是当我尝试将其链接到HTML时常规标签,它似乎不起作用。

如何在Rails HTML文件中加载我的CSS?
CSS文件是否必须位于assets文件夹中的特定文件夹中?

这里是application.rb代码:

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

require 'rails/all'

# Require the gems listed in Gemfile, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(*Rails.groups)

module Indiecritic
  class Application < Rails::Application
    # Settings in config/environments/* take precedence over those specified here.
    # Application configuration should go into files in config/initializers
    # -- all .rb files in that directory are automatically loaded.

    # Set Time.zone default to the specified zone and make Active Record auto-convert to this zone.
    # Run "rake -D time" for a list of tasks for finding time zone names. Default is UTC.
    # config.time_zone = 'Central Time (US & Canada)'

    # The default locale is :en and all translations from config/locales/*.rb,yml are auto loaded.
    # config.i18n.load_path += Dir[Rails.root.join('my', 'locales', '*.{rb,yml}').to_s]
    # config.i18n.default_locale = :de

    # Do not swallow errors in after_commit/after_rollback callbacks.
    config.active_record.raise_in_transactional_callbacks = true
  end
end

我将代码放在哪里以包含其他css资产?

1 个答案:

答案 0 :(得分:0)

是的,样式表进入app/assets/stylesheets

你这样包括它们(对于app/assets/stylesheets/application.css):

<%= stylesheet_link_tag :application %>

如果您要预编译application.css以外的资源,请务必将其包含在要预编译的资产列表中(在config/application.rb中):

# Precompile additional assets.
# application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
Rails.application.config.assets.precompile += %w( something_else.css )

然后你将它们包括在内(对于app/assets/stylesheets/something_else.css):

<%= stylesheet_link_tag :something_else %>

修改

... OR 您可以将somehting_else.css添加到application.css清单,方法是在app/assets/stylesheets/application.css文件的顶部附近添加*= require somehting_else

_wdt:
    resource: "@WebProfilerBundle/Resources/config/routing/wdt.xml"
    prefix:   /_wdt

_profiler:
    resource: "@WebProfilerBundle/Resources/config/routing/profiler.xml"
    prefix:   /_profiler

您应该阅读The Asset Pipeline

以下是与Asset Pipeline相关的几个Railscast: