読者です 読者をやめる 読者になる 読者になる

ばくのエンジニア日誌

技術的なメモなどを書いていきます。

RailsはどこでCSSを指定するのか?

このブログ(ばくのエンジニア日誌)はBAKUNOTEに移転しました。

最近Railsを触ることになり一通りTutorialを実践しているのだが、CSSをどこで指定した良いのか分からなかったので調べてみた。
Railsのバージョンは3.2。

レイアウトテンプレート内の記述

まず一般的に、レイアウトテンプレート内でCSS用のビューヘルパーを使う。 デフォルトでは以下のようになっているはず。

app/views/layouts/application.html.erb
・・・・
 <%= stylesheet_link_tag    "application", :media => "all" %>
・・・・

stylesheet_link_tagの第1引数で、app/assets/stylesheets/からの相対パスで指定する。
上記の場合、app/assets/stylesheets/application.cssが読み込まれる。

デフォルトのCSSの記述

次に、指定したapplication.cssを開いてみる。

app/assets/stylesheets/application.css

 /*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
 * or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the top of the
 * compiled file, but it's generally better to create a new file per style scope.
 *
 *= require_self
 *= require_tree .
 */

ここでファイルを開いて、コメントしか無いからといってスルーしないよう注意。

Rails3.1からAsset pipelineという仕組みが導入されているらしい(詳しくはrailsはどこでcssを指定するのか?)。

コメントの下の方にある

 *= require_self
 *= require_tree .

によって、さらに別のCSSを読み込むよう指定している。

require_treeでstylesheets配下のCSSをすべて読みこむので、嫌な時はこれをはずしちゃえばいい。
ちなみに、独自に作ったものや他所から持ってきたCSSrequire mystyleなどのように指定する。