我正在使用 Thomas McDonald 的 bootstrap-sass gem (Bootstrap 3.0)。我遵循了
Bootstrap and Rails Daniel Kehoe 的教程。
我有application.css.scss，顶部有以下内容：
/*
*= require_self
*= require_tree .
*/
我有framework_and_overrides.css.scss，里面有这行：
@import "bootstrap";
现在我尝试覆盖引导变量 ($body-bg: #f00;) 我找到了 here 并将它们放在这两个文件中的任何一个中，但没有任何变化。我做错了什么？
【问题讨论】：
标签： css ruby-on-rails twitter-bootstrap
您可以通过简单地在@import 指令之前重新定义变量 来覆盖变量。
例如：
$navbar-default-bg: #312312;
$light-orange: #ff8c00;
$navbar-default-color: $light-orange;
@import "bootstrap";
【讨论】：
@import "bootstrap" 指令之前使用引导变量时，我得到一个未定义的变量错误。即$text-color: $gray-light;
@import 之后重新定义它们，为什么它不起作用？ sass 不应该像其他语言一样简单地采用最后一个变量定义吗？
@import 指令之前完成，这样 Bootstrap scss 文件才能使用其中。它们没有被默认值覆盖的唯一原因是因为the default values all use the !default flag，这意味着它们只会在尚未定义变量的情况下使用该值。
@import 之后 因为它们在任何内部范围之前被加载，而这些只是覆盖默认值（不需要!default）。
!default 限定符.. 如果您尝试使用另一个没有!default 的变量来执行此操作，它将再次被覆盖最新定义
查看执行周期。在引导文件中，以这种方式呈现的文件，例如“获取变量>并在导航栏中应用”，这在开始执行引导文件时确实会发生。它存在于引导程序内部，查看导入的顺序流程。 , 变量从 bootstrap/variables 获取并在 bootstrap/navbar 中设置 vavbar 颜色，这将在 navbar 中使用变量 navbar-default-bg 应用颜色。
实际上程序员正在做的是在导航栏中设置颜色后尝试设置变量值。 （在“@importing bootstrap”语句之前或之后，变量变化不会改变导航栏颜色，需要在bootstrap文件中编辑）
如果要更改颜色，请查看下面的代码。
在引导文件中
// 核心变量和mixins
@import "引导程序/变量";
// 组件
@import "引导/导航";
$navbar-default-bg:red; //初始化$navbar-default-bg（导入引导/变量后）
@import "引导/导航栏";这里颜色设置正在执行”
这样就好了，分析执行周期。
但我建议使用其他手动类来应用 bg-color 而不是覆盖引导变量。
【讨论】：