0

LESSを使用してTwitterブートストラップ内で変数を設定できないのはなぜか疑問に思います。bootstrap_and_overrides.css.lessファイルがあるrailsでrubyを使用しています。次のステートメントがあります

    // Your custom LESS stylesheets goes here
    //
    // Since bootstrap was imported above you have access to its mixins which
    // you may use and inherit here
    //
    // If you'd like to override bootstrap's own variables, you can do so here as well
    // See http://twitter.github.com/bootstrap/less.html for their names and    documentation
    //
   // Example:
   // @linkColor: #ff0000;

だから私の理解は、ここで変数を設定できるということです。だから私は設定しました

  @black: #333;

次に、application.css呼び出しファイルで使用しようとしました@blackが、機能しませんか?つまり、レンダリングしません#333

私はこれを間違って理解していますか?、すべての変数とcssスタイルはブートストラップとオーバーライドファイル内にありますか?

アドバイスをいただければ幸いです

4

2 に答える 2

0

私の理解が正しければ、あなたはbootstrap_and_overrides.css.lessファイルを変更していますが、使用されているのはapplication.cssファイルです。
その場合、もちろん、行った変更が反映されないのは当然です。.less最初にファイルを にコンパイルする必要があります.css。その変更を.cssファイルに反映します。

試しに、クライアント側で LESS を使用し、次のように環境をセットアップします。

たとえば、index.htmlファイルに次のように入力します。

<link rel="stylesheet/less" type="text/css" href="application.less" />

ドキュメントの頭に。そしてその下に追加

<script src="less.js" type="text/javascript"></script>

ここless.jsからファイルをダウンロードします。ルートディレクトリ内に配置するか、もちろん場所をカスタマイズして属性に必要なパスを作成することもできます。href

application.less上記を実行したら、ファイル (application.css ではない)を変更する準備が整いました。ファイルから既存のカスタム スタイルをコピーできapplication.cssます。

application.less変数を配置する場所です。

ファイルの名前を に変更し、ヘッダー タグでリンクされているbootstrap_and_overrides.css.lessファイルであることを確認してください。application.less

LESS CSS の詳細については、wikiを参照してください。

于 2013-08-31T03:27:16.247 に答える
0

クライアント側で使用している場合は、http://lesscss.org/#usageの指示に従って、更新された less が使用されていることを確認してください。

また

更新した less を CSS にコンパイルしてから、更新した CSS をコピーします。コンパイルを実行できるツールのリストを次に示します。http://bootstrap.lesscss.ru/less.html#compiling

ブートストラップの変更を整理する方法に関する提案については、SO の質問 Twitter Bootstrap Customization Best Practicesを参照してください。

余談ですが、変更はお勧めしません@black。それを変更すると、予期しないものも含めて、非常に多くのことが変わります。

于 2013-08-30T23:54:19.510 に答える