BS4(2)-基本版面運用

範例結果

三、網格應用

(一)【col-*】

S0:HTML開始結構

S1:標題h2 美化

【Documentaion(文件)】>【Utilities(通用類別)】

(1) 【Text(文字)】(連結處)

(2) 【Color(顏色)】(連結處)

(3) 【Spacing(間隔)】(連結處): margin 或 padding 值設定

(4) 【Borders(邊框)】(連結處)

(5) 【Sizing(尺寸)】(連結處): width 或 height 值設定

S2:利用網格設定【一列四個圖說組合】:【.col-3】

S3:利用中斷點設定各行動裝置排版情形:【.col-8  .col-sm-6  .col-md-4  .col-lg-3  .col-xl-4】