RailsではCSSを特に指定しなくても読み込まれるスタイルシートと、自分で指定して読み込むスタイルシートがあります。
自動で読み込まれるスタイルシート
この自動で読み込まれるスタイルシートはapp/assets/stylesheets/application.cssで指定します。
ディレクトリ以下の全てのスタイルシートを読み込む
*= require_tree .と記述するとapp/assets/stylesheets以下の全ての階層のスタイルシートが読み込まれます。
ディレクトリ直下の直下のスタイルシートを読み込む
*= require_directory .と記述するとapp/assets/stylesheets直下の全てのスタイルシートが読み込まれます。サブディレクトリは読み込まれません。
指定したスタイルシートを読み込む
自動で読み込まれるスタイルシートに加えて、自分でスタイルシートを指定して読み込むには、stylesheet_link_tagを使います。
Step1. スタイルシートを配置する
スタイルシートは、app/assets/stylesheets直下に何かディレクトリを作成し、そこに入れます。ここではbookというディレクトリに入れます。
Step2. Viewでスタイルシートを読み込む。
ビューファイルを開き、次のようにしてスタイルシートを読み込みます。ここでは、book/chapter2.css.scssを読み込みます。
<%= stylesheet_link_tag "book/chapter2", :media => "all" %>
Step3. (SCSSなら)プリコンパイルに追加する。
*= require_tree .を外している場合は、SCSSファイルがプリコンパイルされないため、Sprockets::Rails::Helper::AssetNotPrecompiledとエラーが発生します。
これを解決するには、config/initializers/assets.rbを開き、次のようにbook/chapter2.css.scssをプリコンパイル対象に指定します。
Rails.application.config.assets.precompile += %w( book/chapter2 )
もしくは、ディレクトリごとプリコンパイル対象にしたい場合は、ワイルドカード(*)で指定します。
Rails.application.config.assets.precompile += %w( book/* )
Rails用のアプリケーションサーバー(pumaなど)を再起動して完了です。