【Bootstrap】格線、spacing、flex

格線

• 結構：・container>row>col>內容（內容不要放在col上）

如果什麼都不寫，從xs～到最大，都是一樣
col是從最小的xs為主（行動優先），至於其他尺寸需要在自己設定。

col-sm 倒下的手機
col-md 平板
col-lg 大螢幕
col-xl 大大螢幕

spacing

m/p方向-0~5

例如：
ml-4
ml-auto

flex

都是寫在外層

<div class="d-flex flex-row justify-content-end">  
//d-flex表示啟動flex排版,flex-row可以不用寫,justify-content-end可以排到右邊
           <div>1</div>
           <div>2</div>
           <div>3</div>
 </div>

• 啟用flex

在外層寫d-flex

• flex-direction:row 簡寫成以下

flex-row
flex-row-reverse
flex-column
flex-column-reverse

• justify-content:flex-start 簡寫成以下

justify-content-start
justify-content-end
justify-content-center
justify-content-between
justify-content-around

• align-items:flex-start 簡寫成以下

align-items-start
align-items-end
align-items-center
align-items-baseline
align-items-stretch

​