頁面建立基礎
//自動適應手機螢幕寬度1、col- 針對所有裝置
2、col-sm- 平板 - 螢幕寬度等於或大於 576px
3、col-md- 桌面顯示器 - 螢幕寬度等於或大於 768px)
4、col-lg- 大桌面顯示器 - 螢幕寬度等於或大於 992px)
5、col-xl- 超大桌面顯示器 - 螢幕寬度等於或大於 1200px)
偏移列通過 offset-- 類來設定。第乙個星號( * )可以是 sm、md、lg、xl，表示螢幕裝置型別，第二個星號( * )可以是 1 到 11 的數字。
：.offset-md-4 是把.col-md-4 往右移了四列格。
排版類
.font-weight-bold
.font-weidth-normal
.font-weight-light
.font-italic
.lead
.small
.text-left
.text-right
.text-justify
.text-center
.text-nowarp
.text-lowercase
.text-uppercase
.text-capitalize
.initialism //使元素可滾動，**塊區域最大高度為340px,一旦超出這個高度,就會在y軸出現滾動條
.list-unstyle
.list-inline
.pre-scrollable //使元素可滾動，**塊區域最大高度為340px,一旦超出這個高度,就會在y軸出現滾動條
.text-muted //柔和 灰
.text-primary //重要 藍
.text-success //成功 綠
.text-warning // 警告 黃
.text-danger // 危險 紅
.text-info //提示資訊 墨藍
.text-secondary //副標題 淺灰
.text-dark // 深灰
.text-light // 淺灰（白色背景幾乎看不到）
.text-white //白色
table
必要
.table
組合.table-striped //條紋
.table-border //**邊框
.table-hover //滑鼠懸浮效果
.table-dark //黑色背景
.table-sm //通過減少內邊距來設定較小的**
.table-response //在螢幕寬度小於 992px
.table-responsive-sm < 576px
.table-responsive-md < 768px
.table-responsive-lg < 992px
.table-responsive-xl < 1200px時會建立水平滾動條，
如果可視區域寬度大於 992px 則顯示不同效果（沒有滾動條）
.table-primary 藍色: 指定這是乙個重要的操作
.table-success 綠色: 指定這是乙個允許執行的操作
.table-danger 紅色: 指定這是可以危險的操作
.table-info 淺藍色: 表示內容已變更
.table-warning 橘色: 表示需要注意的操作
.table-active 灰色: 用於滑鼠懸停效果
.table-secondary 灰色: 表示內容不怎麼重要
.table-light 淺灰色，可以是**行的背景
.table-dark 深灰色，可以是**行的背景
.thead-dark //表頭新增黑色背景
.thead-default //表頭新增灰色背景
.rounded //圓角效果
.rounded-circle //橢圓形
.img-thumbnail //設定縮圖(有邊框)
.img-fluid //響應式 設定了 max-width: 100%; 、 height: auto
.float-right/float-left //對齊方式
BootStrap4 基礎模版
新建 html 頁面，複製下方 粘入 bootstrap4 基礎模版 doctype html en utf 8 viewport content width device width,initial scale 1,shrink to fit no stylesheet href hello,wo...
Bootstrap4教程導航
bootstrap4 教程 bootstrap4 安裝使用 bootstrap4 網格系統 bootstrap4 文字排版 bootstrap4 顏色 bootstrap4 bootstrap4 影象形狀 bootstrap4 jumbotron bootstrap4 資訊提示框 bootstrap...
使用SCSS擴充套件Bootstrap4
擴充套件參考 因為打算寫乙個小 而個人時間又不是那麼充裕，所以沒有選擇前後端分離的架構。對於非前後端分離應用來說，bootstrap應該是目前的最佳前端框架之一了。而bootstrap4，是bootstrap的最新版本，其更新內容中，有關自定義擴充套件的支援，相對來說要比以前方便很多。注 scss與...