bootstrap-sassで、ブレイクポイントの変更
方法
- cssファイルの
@import "bootstrap"
より前に、変更したい変数を指定。 - その際に、ブレイクポイントの変数を上書きする。
実践
$screen-xs-min: 240px;
$screen-sm-min: 384px;
$screen-md-min: 496px;
$screen-lg-min: 600px;
@import "bootstrap";
とりあえず、すべて半分の値にしましてみました。 必要な値に変えて下さい。 プロダクション環境では、プリコンパイルをしていないと適用されない場合があると思います。
備考
- ブレイクポイントを変更することによって、 画面サイズ(xs,sm,md,lg)に適用するcssの切り替え点を変えることができます。
- ナビゲーションバーがトグルされるようになるサイズを変更したいときなどに使えます。