2016-11-09 3 views
2

申し訳ありませんが、このnoobに関する質問はありますが、フロントエンドの開発は非常に混乱しています。ブートストラップV4のプリセットCSSを上書きすることはできますか?再起動によって設定されるCSSは重要ですか?

ブートストラップv4.0.0-alpha.5では、「リブート」と呼ばれるものが使用されています。このリブートでは、いくつかのデフォルト値が設定されています(see here)。それは言う: "安全のため、<body>は#fffにデフォルト設定された背景色を宣言しています。"

だから私は使用それを上書きします

html, body { 
background-color: $main-background-color !important; 
} 
をしかし、私は !importantを使用して悪い習慣であると考えられていることを読みました。ボディータグのみに適用される場合、このステートメントもこの場合正しいですか?

ありがとうございます!

答えて

1

/scss/_bootstrap.scss部分を調べると(正しい順序で他のすべての部分部分がまとめられています)、上部に次のように表示されます。一部/scss/_custom.scssがパーシャル/scss/_variables.scssより前に解析されたことを意味します。 :あなたが名前の部分的に見れば

// Core variables and mixins 
@import "custom"; 
@import "variables"; 

/scss/_variables.scssあなたが行が表示されます:

$body-bg: #fff !default; 

!defaultはSASS/SCSSでフォールバックに等しいです。したがって、この特定の行の前に変数​​に値が割り当てられていない場合は、デフォルトで#fffになります。変数​​にこの行に遭遇したときにすでに値が割り当てられている場合、その値は再割り当てされません。 /scss/_variables.scssの行はスキップされます。

あなたが望むことを行う適切な方法は、次のとおりです。 1)scss/_custom.scssという名前の部分をエディタで開きます。これは、他のすべての部分(/scss/_variables.scssを含む)の前に解析されているためです。 2)​​という変数の行をコピーして、scss/_variables.scss部分から/scss/_custom.scssに貼り付けます。 3)値#fffを任意の値に変更します。 4)!defaultという語を削除してください(/scss/_custom.scssの行から)。 5)/scss/custom.scssを保存し、/scss/bootstrap.scssを再コンパイルしてください。

/scss/_variables.scssにあるすべての変数を使って、このようにする必要があります。 EDIT:私はこう言っていました:出荷されたブートストラップ変数(scss/_variables.scss)を変更する場合は、このようにする必要があります。

/scss/_reboot.scss/scss/_variables.scssの後に解析される)では、背景は変数​​にあるものに設定されます。 :

body { 
    // Make the `body` use the `font-size-root` 
    font-family: $font-family-base; 
    font-size: $font-size-base; 
    line-height: $line-height-base; 
    // Go easy on the eyes and use something other than `#000` for text 
    color: $body-color; 
    // By default, `<body>` has no `background-color` so we set one as a best practice. 
    background-color: $body-bg; 
} 

/scss/_variables.scss内の変数は!default旗を持っていないが、それは/scss/_custom.scssから無効にすることができるように、一つは本当に、要求された場合、その後、あなたはGitHubのレポで問題を開き、/要求を議論する必要があります。

+0

詳細な回答、ありがとう!$ body-colorがすでにプリセットされているブートストラップをCDN経由でロードしたい場合は、どのように処理するのか知っていますか? !重要なのは、正しい方法のように思える、私は正しい? – rapstacke

+1

はい、私は恐れています。 CSSがscssからコンパイルされると。 –

+1

入力が速すぎます。 –

関連する問題