css - 在我的 Bootstrap/Rails 应用程序中，我应该将自定义导航栏 CSS 添加到哪个文件？

Question

我已经在我的应用程序上启动并运行了一些 Bootstrap 功能。到目前为止，一切都很好。我知道导航栏的 2 个默认颜色是黑色和白色，使用 navbar-default 和 navbar-inverse。我正在尝试将导航栏颜色更改 CSS 添加到 assets/STLyesheets/application.css 文件，但没有任何运气。我将其更改为的颜色是绿色。 (一个灌溉系统网站。绿草如茵，耶)

这是我的 application.css 文件当前的样子。

 /*
 * This is a manifest file that'll be compiled into application.css, which will include all the 
 files listed below
 * 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 .
 */

 .navbar-default {
     background-color: #33FF33;
     border-color: #E7E7E7;
 } 

Answer 1

在 app/assets/stylesheets 下创建一个新文件，将自定义样式添加到文件中，然后将其包含在 application.css.scss 中。

@import custom_navbar.css.scss;

您需要将 application.css 更改为 application.css.scss 并完全删除注释。然后，您将使用 @import 指令导入您想要的文件。

请注意，这在某种程度上违反了惯例，但它可能适合您的目的。您可以阅读更多关于 structuring SASS projects 的信息在 SASS 博客上。