不同动作的不同样式表

Question

假设我有一个会话控制器并且有两个操作：菜单和新建。

我对每个操作都有不同的样式表和 html 文件：

menu.css.scss
new.css.scss

不幸的是，当我加载每个网页时，它同时使用了两个 css 文件。我怎样才能停下来？

Answer 1

这是 Rails 的工作方式（它将样式表编译成一个 stylesheet.css），使 individual 样式与每个操作一起工作的最简单方法是添加在每个操作的 html 视图中为您的父级 div 创建一个 ID，然后在样式表中将其声明为父级。

<div id="menu"...>

<div id="new"...>

并在 menu.css.scss 中添加此

#menu {
 .your_class_details_here {

 }
 .next_style_here {

 }

}

在new.css.scss

#new {
 .your_details_here {

 }
 .next_style_here {

 }

}

这样就不会在其他视图之间共享这些样式。

Answer 2

我所要做的就是从我的 application.js 中删除 //= require_tree . 并从我的 application.css

中删除 *= require_tree.

然后我就在 config/initializers/assets.rb

中像这样预编译了它们

Rails.application.config.assets.precompile += %w( menu.css )
Rails.application.config.assets.precompile += %w( new.css )

Different Stylesheets for Different Actions