我不想覆寫$blueBootstrap SASS 中的變數。$primary并且$secondary正在作業，但$blue, $teal, $orange不是主題顏色的其他顏色和其余顏色。這是我的 SASS 檔案：
// COLORS
$primary: #D91473;
$secondary: #2E3092;
$blue: #349DD6;
$teal: #309C9E;
@import '../../node_modules/bootstrap/scss/functions';
@import '../../node_modules/bootstrap/scss/variables';
// Bootstrap Main
@import '../../node_modules/bootstrap/scss/bootstrap';
我的標記只是一個簡單的：
<div class="container-fluid bg-blue">
<p>test</p>
</div>
正如您在課堂上看到的那樣，它是bg-blue，它不起作用但bg-primary有效。
uj5u.com熱心網友回復：
.bg-blue不是由 Bootstrap 生成的實用程式類。因此，雖然您可能$blue成功地覆寫了顏色，但您并沒有改變它是否包含在用于生成.bg-類的集合中。
乍一看，似乎所有的.bg-前綴類都是從主題顏色映射生成的。按照描述如何添加到此地圖的檔案部分，您可能想要執行以下操作：
// Create your own map
$custom-colors: (
"blue": $blue
);
// Merge the maps
$theme-colors: map-merge($theme-colors, $custom-colors);
請注意，這意味著藍色現在是主題顏色集合的一部分，并將貫穿該集合所經過的所有處理，因此您可能會發現它添加了您不期望的其他實用程式類或具有其他副作用。相反，您可能能夠找到一種方法來插入生成背景顏色的程序，這將是一個更精確的操作，但實施起來可能更復雜。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/370639.html
上一篇：如何使用nodeCLI命令分析Nest.js應用程式？
下一篇：使用引導程式將導航欄向右對齊