使用我们内置的自定义变量文件自定义 Bootstrap，并通过新的 $enable-* Sass 变量轻松切换全局 CSS 偏好设置。根据需要覆盖变量的值并使用 npm run test 重新编译。
你可以在 Bootstrap 的 scss/_config.scss 文件中查找并自定义这些关键全局选项的变量。
| 变量 | 值 | 描述 |
|---|---|---|
$spacer | 1rem (默认)，或任何大于 0 的值 | 指定用于以编程方式生成我们的默认间隔值 边距, 填充，和 间隙 工具类 |
$enable-rounded | true (默认) 或 false | 启用预定义 border-radius 各种组件的样式。 |
$enable-shadows | true 或者 false (默认) | 启用预定义装饰 box-shadow 各种组件上的样式。不影响 box-shadow用于聚焦状态。 |
$enable-gradients | true 或 false (默认) | 启用预定义梯度通过 background-image 各种组件的样式。 |
$enable-transitions | true (默认) 或 false | 启用预定义 transition关于各种组件。 |
$enable-reduced-motion | true (默认) 或 false | 启用该 prefers-reduced-motion 媒体查询，它根据用户的浏览器/操作系统偏好抑制某些动画/过渡效果。 |
$enable-grid-classes | true (默认) 或 false | 启用为网格系统生成 CSS 类（例如 .row, .md:col-1等等）。 |
$enable-cssgrid | true 或者 false (默认) | 启用该 CSS 网格系统 (e.g. .grid, .md:g-col-1等等）。 |
$enable-container-classes | true (默认) 或 false | 启用为布局容器生成 CSS 类。 |
$enable-button-pointers | true (默认) 或 false | 为非禁用的按钮元素添加“手型”光标。 |
$enable-negative-margins | true 或者 false (默认) | 启用生成 负边距工具. |
$enable-deprecation-messages | true (默认) 或 false | 设置为 false 在使用任何计划在未来主要版本中删除的已弃用混入和函数时隐藏警告。 |
$enable-smooth-scroll | true (默认) 或 false | 适用 scroll-behavior: smooth 在全球范围内，除了请求减少动画效果的用户外 prefers-reduced-motion 媒体查询 |