我最近開始為一個專案定制 Bootstrap。我們正在使用 Bootstrap v5.1.1 以了解它的價值。
我明白這是因為!default我需要在匯入 Bootstrap 變數之前定義我的自定義。我遇到了一個問題，我想使用默認變數來定義自定義。更具體地說，我試圖設定$btn-font-weight為粗體。我想該生產線是：$btn-font-weight: $font-weight-bold;。這不起作用，因為我沒有進行自定義，$font-weight-bold因此在匯入 Bootstrap 的默認值之前不會對其進行定義。
我發現這個問題建議將 Bootstrap 變數按原樣復制到自定義 sass 中，但答案是 6 歲，所以我想知道是否有更好的方法。
uj5u.com熱心網友回復：
在呼叫 Bootstrap 模塊之前定義變數是改變 Bootstrap 構建自身方式的最佳（也是唯一）方法。這就是 Bootstrap 自己建議這樣做的方式：https : //getbootstrap.com/docs/4.0/getting-started/theming/，來自文章：
同一個 Sass 檔案中的變數覆寫可以在默認變數之前或之后。但是，當覆寫 Sass 檔案時，您的覆寫必須在匯入 Bootstrap 的 Sass 檔案之前出現。
我見過的最好的方法是創建一個包含所有覆寫變數的 _bootstrap-settings.scss 檔案，然后在呼叫引導模塊之前 @import 該檔案，如下所示：
// Your variable overrides
$body-bg: #000;
$body-color: #111;
// Bootstrap and its default variables
@import "node_modules/bootstrap/scss/bootstrap";uj5u.com熱心網友回復：
由于您在自定義中使用了現有的 Bootstrap 變數，因此您需要先 @import 變數，進行更改，然后 @import bootstrap ...
@import "functions";
@import "variables";
@import "utilities";
$btn-font-weight: $font-weight-bold;
@import "bootstrap";
SASS 演示
另請參閱：如何使用 SASS 擴展/修改（自定義）Bootstrap
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/314714.html
標籤：推特引导 蠢货 bootstrap-5
上一篇：右對齊單個元素