メインコンテンツにスキップ ドキュメント ナビゲーションにスキップ
in English

オプション

組み込み変数を使用して 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-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ユーティリティ クラスでサフィックスを有効にします。