1

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 の間で間違いなく混乱しています。私は一日中これと戦ってきました。

すべてのヘルプは大歓迎です。

4

1 に答える 1

3

私は Rails に詳しくありません。ただし、CSS を使用しているか LESS を使用しているかに関係なく、# を追加する必要があります。

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

これが機能しない場合は、ブートストラップの variables.less ファイルを確認する必要があります。色変数 (@blue および @blueDark) を必要なものに変更し、CSS を再コンパイルします。

添加:

これは、ブートストラップ ファイルを直接変更する必要なく、ブートストラップ変数を上書きする方法です。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
于 2012-12-08T23:33:56.243 に答える