Twitterのブートストラップコードには!default
、末尾にが付いた多くのCSSプロパティがあります。
例えば
p {
color: white !default;
}
何をし!default
ますか?
更新
はっきりしないのは悪い。BootstrapのSASS部分を使用しています。
Twitterのブートストラップコードには!default
、末尾にが付いた多くのCSSプロパティがあります。
例えば
p {
color: white !default;
}
何をし!default
ますか?
更新
はっきりしないのは悪い。BootstrapのSASS部分を使用しています。
回答:
Twitter Bootstrapは、私が見た限りではLESSを使用しています。一方、!default
は実際にはSassの一部であり、Sass変数($var
)にデフォルト値を与えるために使用されます。これにより、Sassであっても、指定されたコンテキストでは無効になります。
また、私はへの参照を見つけることができていませんでした!default
でLESSのドキュメント、および私の知識には、サスに排他的です。これはBootstrapのソースで見つかり、他の場所では見つかりませんでしたか?BootstrapのスタイルシートにSass / SCSSコードが表示されているのを正直覚えていないからです。
価値があるのは!
、CSSで始まる唯一の有効なトークンはです!important
。これはすでに知っているかもしれません。
$yellow: #ffc40d !default;
!defaultは、BootstrapSassでよく使用されます。これは逆の!importantに似ています。開発者がブートストラップをさらにカスタマイズできるように、すべてのブートストラップ変数は!defaultを使用して設定されます。!defaultを使用すると、sassは変数がまだ設定されていない場合にのみ変数を定義します。
これにより、柔軟性が高まります。
//Example1 Dress color = red
$auroras-dress-color: blue;
$auroras-dress-color: red;
//Example2 Dress color = red
$auroras-dress-color: blue !default;
$auroras-dress-color: red;
//Example3 Dress color = blue
$auroras-dress-color: blue;
$auroras-dress-color: red !default;
では、なぜこれが重要なのでしょうか。Bootstrapはパッケージです。ほとんどの人はブートストラップソースを編集しません。ブートストラップソースは絶対に更新しないでください。ブートストラップをカスタマイズするには、独自の変数ファイルを追加し、ブートストラップコードを使用してコンパイルしますが、ネイティブのブートストラップパッケージには触れないでください。Bootstrap sassのページには、ドキュメントでカスタマイズおよびコンパイルする方法についての完全な説明があります。
lessがこれを行わない理由はわかりません。私はあまり少ない作業をしていませんし、それ自体に変数管理が組み込まれているかどうかもわかりません。