更改按钮填充覆盖sass变量

我试图使用sass预定义变量覆盖左右两侧的

btn lg

填充，但找不到该变量。我能找到的只是

.btn-lg {
  @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
}

---

如何通过覆盖自定义SCSS文件中的sass变量来更改bootstrap 4中btn lg的左/右填充

您可以在_variables.scss文件中找到引导的变量默认值。

.btn lg

使用的默认变量为：

$btn-padding-y-lg:            $input-btn-padding-y-lg !default;
$btn-padding-x-lg:            $input-btn-padding-x-lg !default;
$btn-font-size-lg:            $input-btn-font-size-lg !default;
$btn-line-height-lg:          $input-btn-line-height-lg !default;

$input-btn-padding-y-lg:      .5rem !default;
$input-btn-padding-x-lg:      1rem !default;

要更改

.btn lg

的填充，您需要覆盖custom.scss文件中的

$input-btn-padding-y-lg

和

$input-btn-padding-x-lg

的默认值。请记住，您的覆盖必须在导入引导的Sass文件之前进行

例如，为了减少

.btn lg

的填充，我将把它放在我的custom.scss文件中：

---

非常感谢你。这真的很有帮助，不客气@zinnira。如果答案能解决你的问题，你能接受吗？非常感谢。

// Variable overrides
$input-btn-padding-y-lg:      0.2rem;
$input-btn-padding-x-lg:      0.5rem;

// Import Bootstrap and its defaults
@import "../bootstrap/scss/bootstrap"