Ruby on Rails - 覆盖application.css

Question

我正在尝试使用其他css覆盖我的application.css，包含在标头中。我想通过这种方式自定义我的application.css。

我的标题

= stylesheet_link_tag 'application', media: 'all'
= stylesheet_link_tag 'customized_css', media: 'all'

实际

application.css.scss覆盖了我的tour.css.scss，即使它在任何其他css之前加载

修改

覆盖样式的文件顺序是正确的，但应用程序的选择器特性优于巡回赛，所以这就是原因。解决方案 - 改为使用ID。

Documentation

Specificity calculator

感谢@tonyedwardspz解决方案

Answer 1

您遇到的问题是CSS特异性。

您已按正确的顺序声明了css文件。但是，tour.css.scss中的规则具有较低的css特异性，因此无法覆盖application.css.scss中的声明。

要解决你可以做以下三件事之一：

• 重写规则以获得更高的特殊性。将类应用于元素并将其与tour.css.scss
中的现有规则相结合
• 重写规则以匹配application.css.scss中声明的选择器。这将允许级联按预期工作，但可能会影响其他页面元素。
• 将类应用于特定于每个页面的body标记。然后，您可以将您的选择仅定位到一个页面。

您可以阅读有关css特异性here的更多信息。