使用內(nèi)置變量快速自定義Bootstrap,方便快捷的切換全局CSS。
你可以在Bootstrap的 ?scss/_variables.scss
?文件中為關(guān)鍵的全局選項查找和定義這些變量。使用內(nèi)置的自定義變量文件定義Bootstrap,并使用新的? $enable-* Sass
?變量輕松切換全局CSS。 覆蓋變量的值,并根據(jù)需要使用 ?npm run test
?重新編譯。
變量 | 值 | 描述 |
---|---|---|
$spacer
|
1rem (default), or any value > 0 |
指定默認的spacer值,以編程方式生成我們的spacer實用工具。 |
$enable-rounded
|
true (default) or false
|
在各種組件上啟用預定義的 border-radius 樣式。 |
$enable-shadows
|
true or false (default) |
在各種組件上啟用預定義的 box-shadow 樣式。 |
$enable-gradients
|
true or false (default) |
通過各種組件上的 background-image 樣式啟用預定義的漸變。 |
$enable-transitions
|
true (default) or false
|
在各種組件上啟用預定義的 transition 。 |
$enable-reduced-motion
|
true (default) or false
|
啟用 prefers-reduced-motion 媒體查詢 ,該查詢可根據(jù)用戶的瀏覽器/操作系統(tǒng)首選項抑制某些動畫/過渡。 |
$enable-grid-classes
|
true (default) or false
|
為網(wǎng)格系統(tǒng)啟用CSS類的生成(例如 .row ,.col-md-1 等)。 |
$enable-caret
|
true (default) or false
|
在 .dropdown-toggle 上啟用偽元素插入符。 |
$enable-button-pointers
|
true (default) or false
|
將“手形”光標添加到未禁用的按鈕元素。 |
$enable-rfs
|
true (default) or false
|
全局啟用RFS. |
$enable-validation-icons
|
true (default) or false
|
在文本輸入中啟用 background-image 圖標,并在某些自定義表單中啟用驗證狀態(tài)。 |
$enable-negative-margins
|
true or false (default) |
啟用負值的margin實用工具的生成。 |
$enable-deprecation-messages
|
true or false (default) |
將其設(shè)置為 true ,以便在使用任何計劃在v5 中刪除的已棄用mixin和函數(shù)時顯示警告。 |
$enable-important-utilities
|
true (default) or false
|
在實用工具類中啟用 !important 后綴。 |
更多建議: