オプション

組み込み変数を使用して Bootstrap をすばやくカスタマイズし、グローバルな CSS 設定を簡単に切り替えて、スタイルと動作を制御します。

組み込みのカスタム変数ファイルを使用して Bootstrap をカスタマイズし、新しい$enable-*Sass 変数を使用してグローバル CSS 設定を簡単に切り替えます。変数の値をオーバーライドし、必要に応じて再コンパイルしnpm run testます。

scss/_variables.scssこれらの変数は、Bootstrap のファイルで主要なグローバルオプションを見つけてカスタマイズできます。

変数	値	説明
`$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`ます`.col-md-1`。
`$enable-container-classes`	`true`(デフォルト) または`false`	レイアウトコンテナーの CSS クラスの生成を有効にします。(v5.2.0 の新機能)
`$enable-caret`	`true`(デフォルト) または`false`	で疑似要素キャレットを有効にし`.dropdown-toggle`ます。
`$enable-button-pointers`	`true`(デフォルト) または`false`	無効になっていないボタン要素に「手」カーソルを追加します。
`$enable-rfs`	`true`(デフォルト) または`false`	RFSをグローバルに有効にします。
`$enable-validation-icons`	`true`(デフォルト) または`false`	`background-image`検証状態のテキスト入力および一部のカスタムフォーム内のアイコンを有効にします。
`$enable-negative-margins`	`true`または`false`(デフォルト)	負のマージンユーティリティの生成を有効にします。
`$enable-deprecation-messages`	`true`(デフォルト) または`false`	`false`で削除される予定の非推奨の mixin および関数を使用する場合に警告を非表示にするには、に設定し`v6`ます。
`$enable-important-utilities`	`true`(デフォルト) または`false`	`!important`ユーティリティクラスでサフィックスを有効にします。
`$enable-smooth-scroll`	`true`(デフォルト) または`false`	メディアクエリ`scroll-behavior: smooth`を使用してモーションの削減を要求するユーザーを除き、グローバルに適用されます`prefers-reduced-motion`