Question

我正在使用Twitter Bootstrap开发Rails 3.2应用程序。我试图在bootstrap_and_overrides.css.less中覆盖Bootstrap的颜色。

我已经能够使用LESS变量覆盖颜色。例如：

    @navbarBackground: @blue;
    @navbarBackgroundHighlight: @blueDark;

但是，我想偏离颜色变量。我似乎无法像5092CC那样放入十六进制颜色。我不想在LESS中重新定义颜色变量，因为我读过这会导致问题。

我也在尝试更改所有标题标签的颜色。我希望它们都是相同的颜色。但是，Bootstrap忽略了我尝试过的每一个变化。我最近的尝试是：

    h1, h2, h3, h4, h5, h6 {
      color: 325B7F;
      small {
        color: 325B7F;
      }
    }

我肯定在常规CSS和LESS之间感到困惑。我一整天都在努力争取这个。

非常感谢所有帮助。

Answer 1

我不熟悉Rails。但是，无论您使用的是CSS还是LESS，您仍然需要添加＃。

h1, h2, h3, h4, h5, h6 {
  color: #325B7F;
  small {
    color: #325B7F;
  }
}

如果这不起作用，你应该看一下bootstrap的variables.less文件。将颜色变量（@blue和@blueDark）更改为您需要的任何内容并重新编译CSS

增加：

这是我覆盖bootstraps变量的方式，无需直接更改任何引导程序文件。我有一个名为mysite.less的文件：

// bootstrap less files located in another folder 
@import "../../bootstrap/less/bootstrap.less";
@import "../../bootstrap/less/responsive.less";

// mysite overwrites located in my own project folder
@import "variables.less";

在variables.less中重新定义要覆盖的变量：

@blue: #123456;
@blueDark: #678912;

最后编译你的CSS：

lessc mysite.less > bootstrapincludingmyoverwrites.css

覆盖Twitter Bootstrap

1 个答案: