Bootstrap グリットレイアウトの応用

対応サイズの指定

576px以上　col-sm　
768px以上　col-md　
992px以上　col-lg　  
1200px以上  col-xl　
全大きさ　　colのみ

一定の大きさで見えないようにする

iPad以上の大きさで見えないようにする場合

d-lg-none

一定の大きさで見えるようにする

iPad以上の大きさで見えるようにする

d-none  (全体で見えないように設定)
d-lg-block(iPad以上の大きさで表示)

row以下の順序を入れ替える

.row
  .col-3.bg-info
    1
  .col-4.bg-success
    2
  .col-5.bg-danger
    3

.row.mt-5
  .col-3.bg-info
    1
  .col-4.bg-success
    2
  .col-5.bg-danger
    3
.row.mt-3
  .col-3.bg-info.order-3
    1
  .col-4.bg-success.order-2
    2
  .col-5.bg-danger.order-1
    3

order-[数字]
と、することで数字の小さい方から左寄せとなる