2

css の優先順位規則がレールでどのように機能するかを理解しようとしています。

コントローラーごとに異なる css ルールを使用したいアプリがあり、css.scss ファイルの 1 つに css を追加すると、すべてのコントローラー ページに影響します。

admin.css.scss:

body {
    background: #fff;
}

rsv_ps.css.scss

body {
    background: url("DSC_1581.JPG") no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='DSC_1581.JPG', sizingMethod='scale');
    -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='DSC_1581.JPG', sizingMethod='scale')";
}

両方http://localhost:3000/adminまたはhttp://localhost:3000/rsvps/newに移動すると、両方に背景画像があります。

で始まる URL は admin.css.scss スタイルシートをhttp://localhost:3000/admin使用し、rsv_ps.css.scss スタイルシートを使用すべきではありませんか?

4

3 に答える 3

4

@meagarと@catfishによるコメントは正しいです。（なぜ彼らが答えを投稿しないのかわからない）

個別のページは整理用であり、CSSを個別に保持するためのものではありません。アセットパイプラインは、個別のcssファイルを1つの大きなファイルに結合して最小化します。

したがって、特定のセレクターを使用して、自分でスタイルを分離する必要があります。

何かのようなもの

# for admin
body.admin {

}

#html
<body class='admin'>


# for everything else
body.default {

}

#html
<body class='default'>

レイアウトでマークアップを指定するには

<body class="<%= @admin ? 'admin' : 'default' %>">
于 2012-07-18T04:33:33.897 に答える
1

いつでも行*= require_tree .を削除してから、コンパイルするファイルを含めるようにマニフェストを手動で設定できますapplication.css（に変換application.cssしapplication.css.scssて使用することもできます@import）。stylesheet_link_tagつまり、ヘルパーを使用して、各ビューに特定のスタイルシートを追加できます。コンパイルする必要のあるファイル（に含まれていない）をに追加する必要があることに注意してください.css/.scssapplication.cssconfig/environments/production.rb

また、管理者用の本文で特定のcssクラスを使用することもできます。これにより、デフォルトの本文のスタイルが上書きされます。

<body class='<%= 'admin' if @admin %>'>

@adminコントローラーにフィルターを設定します。

于 2012-07-18T04:40:25.710 に答える