Bootstrap グリッドシステムを用いたグリッドの作成になれるための基本的なグリッドレイアウトです。
Bootstrap グリッドシステムには5つの段階があり, それぞれ異なる画面サイズのデバイスをサポートします。各段階は最小のビューポートサイズから始まり, 上書きされない限り自動的により大きいデバイスに適用されます。
3列の等幅カラムはデスクトップサイズからより大きいデスクトップサイズに対してスケールします。. モバイルデバイスやタブレットでは, カラムは自動的にスタックされます。
様々な幅のデスクトップサイズからより大きいデスクトップサイズに対してスケールします。一つの水平なブロックに付きグリッドカラムは12まで並べることができます。
デスクトップからより大きいデスクトップサイズに対してスケールします。
全幅の要素にはグリッドクラスは必要ありません。
ネストはとても簡単で, カラムの中にカラムの列を配置するだけです。このネストされたカラムは, それを含んだカラムと共にデスクトップからより大きいデスクトップサイズに対してスケールします。
モバイルデバイスやタブレット以下のサイズにおいては, ネストされたカラムとそれを含んだカラムはスタックされます。
Bootstrap v4 のグリッドシステムは xs(最小), sm(小), md(中), lg(大), xl(より大)の5段階のクラスがあります。これらのクラスを組み合わせてよりダイナミックでフレキシブルなレイアウトを作成することができます。
各段階のクラスはスケールアップします。すなわち, もし xs と sm で同じ幅に設定しようとした場合, xs を指定するだけで済みます。