デスクトップからタブレット、または xl から lg まで、それぞれ 1280 個のブレークポイントを必要とするデザインのアプリケーションがあります。ただし、Bootstrap 自体には 1200 に xl ブレークポイントがあります。
ブートのために xl ブレークポイントをグローバルに変更する必要があります。 Bootstrap 4 をソースから再コンパイルする必要がありますか?
Sass ビルドでこれを設定してみました:
リーリーただし、グローバル xl ブレークポイントには変更はなく、幅 1200 ピクセルでブレークします。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
＃＃＃例えば：＃＃＃ リーリー$grid-breakpoints変数を変更すると、正常に動作します。custom.scssの/bootstrapまたはbootstrap/variablesを @import ブートストラップの後にインポートする必要があることに注意してください。デモ:
https://codeply.com/go/MlIRhbJYGj参照:
SASS を拡張/使用してブートストラップ 4 を変更 (カスタマイズ) する方法ブートストラップ 4.x および 5.x
ブートストラップ ソースをインポートする前に、
リーリー$grid-breakpoints変数と$container-max-widths変数をオーバーライドする必要があります。これは実際の例です (scss):