Bootstrap 類 參考
所有 Bootstrap 類完整列表
所有 Bootstrap 類的完整列表,附帶說明和示例
類 | 描述 | 示例 | 類別 |
---|---|---|---|
.active |
為表格行 (<tr> ) 或表格單元格 (<td> ) 新增灰色背景色 (懸停時使用的顏色相同) |
試一試 | 表格 |
.active |
為預設導航欄中的活動連結新增灰色背景色。為反轉導航欄中的當前連結新增黑色背景和白色文字。 | 試一試 | 導航欄 |
.active |
為列表組中的活動列表項新增藍色背景色 | 試一試 | 列表組 |
.active |
新增藍色背景色以模擬“按下”的按鈕 | 試一試 | 按鈕 |
.active |
為條紋進度條新增動畫效果 | 試一試 | 進度條 |
.active |
為下拉選單中的活動下拉項新增藍色背景色 | 試一試 | 下拉選單 |
.active |
為活動分頁連結新增藍色背景色 (以突出顯示當前頁) | 試一試 | 分頁 |
.affix |
Affix 外掛允許元素固定 (鎖定/粘滯) 在頁面上的某個區域。它切換 position:fixed 的開啟和關閉 |
試一試 | Affix |
.alert |
建立提醒訊息框 | 試一試 | 提醒框 |
.alert-danger |
紅色警告框。指示危險或潛在的負面操作 | 試一試 | 提醒框 |
.alert-dismissible |
與 .close 類一起使用,用於關閉警告框 |
試一試 | 提醒框 |
.alert-info |
淺藍色警告框。指示一些資訊 | 試一試 | 提醒框 |
.alert-link |
用於警告框中的連結,以新增匹配的彩色連結 | 試一試 | 提醒框 |
.alert-success |
綠色警告框。指示成功的或積極的操作 | 試一試 | 提醒框 |
.alert-warning |
黃色警告框。指示應謹慎對待此操作 | 試一試 | 提醒框 |
.badge |
建立一個圓形徽章 (灰色圓圈 - 通常用作數字指示器) | 試一試 | 徽章 |
.bg-danger |
為元素新增紅色背景。表示危險或負面操作 | 試一試 | 輔助類 |
.bg-info |
為元素新增淺藍色背景色。表示一些資訊 | 試一試 | 輔助類 |
.bg-primary |
為元素新增藍色背景色。表示重要事項 | 試一試 | 輔助類 |
.bg-success |
為元素新增綠色背景色。表示成功或積極的操作 | 試一試 | 輔助類 |
.bg-warning |
為元素新增黃色背景色。表示警告或負面操作 | 試一試 | 輔助類 |
.breadcrumb |
分頁。指示當前頁在導航層次結構中的位置 | 試一試 | 分頁 |
.btn |
建立一個基本按鈕 (灰色背景和圓角) | 試一試 | 按鈕 |
.btn-block |
建立一個跨越父元素整個寬度的塊級按鈕 | 試一試 | 按鈕 |
.btn-danger |
紅色按鈕。指示危險或負面操作 | 試一試 | 按鈕 |
.btn-default |
預設按鈕。白色背景和灰色邊框 | 試一試 | 按鈕 |
.btn-group |
將按鈕組合在一起,顯示在同一行 | 試一試 | 按鈕組 |
.btn-group-justified |
使按鈕組跨越螢幕的整個寬度 | 試一試 | 按鈕組 |
.btn-group-lg |
大型按鈕組(使按鈕組中的所有按鈕變大 - 增加字號和內邊距) | 試一試 | 按鈕組 |
.btn-group-sm |
小型按鈕組(使按鈕組中的所有按鈕變小) | 試一試 | 按鈕組 |
.btn-group-xs |
超小按鈕組 (使按鈕組中的所有按鈕都超小) | 試一試 | 按鈕組 |
.btn-group-vertical |
使按鈕組垂直堆疊 | 試一試 | 按鈕組 |
.btn-info |
淺藍色按鈕。表示資訊 | 試一試 | 按鈕 |
.btn-link |
使按鈕看起來像連結 (獲取按鈕行為) | 試一試 | 按鈕 |
.btn-lg |
大按鈕 | 試一試 | 按鈕 |
.btn-primary |
藍色按鈕。 | 試一試 | 按鈕 |
.btn-sm |
小按鈕 | 試一試 | 按鈕 |
.btn-success |
綠色按鈕。表示成功或積極的操作 | 試一試 | 按鈕 |
.btn-warning |
黃色按鈕。表示警告或負面操作 | 試一試 | 按鈕 |
.btn-xs |
超小按鈕 | 試一試 | 按鈕 |
.caption |
在 .thumbnail 中新增說明文字 |
試一試 | 圖片 |
.caret |
建立一個caret 箭頭圖示 ,表示按鈕是下拉選單 | 試一試 | 下拉選單 |
.carousel |
建立一個輪播 (幻燈片) | 試一試 | 輪播 |
.carousel-caption |
為輪播中的每個幻燈片建立說明文字 | 試一試 | 輪播 |
.carousel-control |
下一個和上一個連結的容器 | 試一試 | 輪播 |
.carousel-indicators |
在每個幻燈片的底部新增小圓點/指示器 (指示輪播中有多少張幻燈片,以及使用者當前正在檢視哪張幻燈片) | 試一試 | 輪播 |
.carousel-inner |
幻燈片專案的容器 | 試一試 | 輪播 |
.center-block |
居中任何元素 (將元素設定為 display:block ,並設定 margin-right:auto 和 margin-left:auto ) |
試一試 | 輔助類 |
.checkbox |
複選框的容器 | 試一試 | 輸入框 |
.checkbox-inline |
使多個複選框顯示在同一行 | 試一試 | 輸入框 |
.clearfix |
清除浮動 | 試一試 | 輔助類 |
.close |
表示一個關閉圖示 | 試一試 | 輔助類 |
.col-*-* |
響應式網格 (跨越 1-12 列)。超小裝置 手機 (< 768px),小裝置 平板電腦 (≥768px),中等裝置 桌面 (≥992px),大裝置 桌面 (≥1200px)。列值可以是 1-12。 | 試一試 | Grid |
.col-*-offset-* |
將列向右移動。這些類將列的左邊距增加 * 列 | 試一試 | Grid |
.col-*-pull-* |
更改網格列的順序 | 試一試 | Grid |
.col-*-push-* |
更改網格列的順序 | 試一試 | Grid |
.collapse |
表示可摺疊內容 - 可按需隱藏或顯示 | 試一試 | 摺疊 |
.collapse in |
預設顯示可摺疊內容 | 試一試 | 摺疊 |
.container |
固定寬度容器,寬度由螢幕尺寸決定。左右邊距相等。 | 試一試 | 容器 |
.container-fluid |
跨越螢幕全寬的容器 | 試一試 | 容器 |
.control-label |
允許標籤用於表單驗證 | 試一試 | 表單 |
.danger |
為表格行 (<tr> ) 或表格單元格 (<td> ) 新增紅色背景。表示危險或潛在的負面操作 |
試一試 | 表格 |
.disabled |
停用按鈕 (新增不透明度並在懸停時顯示“禁止停車”圖示) | 試一試 | 按鈕 |
.disabled |
停用下拉選單項 (新增灰色文字顏色並在懸停時顯示“禁止停車”圖示) | 試一試 | 下拉選單 |
.disabled |
停用分頁連結 (無法點選 - 新增灰色文字顏色並在懸停時顯示“禁止停車”圖示) | 試一試 | 分頁 |
.disabled |
停用列表組中的列表項 (無法點選 - 新增灰色背景色並在懸停時顯示“禁止停車”圖示) | 試一試 | 列表組 |
.divider |
用於在下拉選單中分隔連結,帶有細的水平邊框 | 試一試 | 下拉選單 |
.dl-horizontal |
將 <dl> 元素中的術語 <dt> 和描述 <dd> 排列在一起。最初像預設的 <dl> ,但當瀏覽器視窗擴充套件時,它們會並排排列 |
試一試 | 排版 |
.dropdown |
建立一個可切換的選單,允許使用者從預定義列表中選擇一個值 | 試一試 | 下拉選單 |
.dropdown-header |
用於在下拉選單中新增標題 | 試一試 | 下拉選單 |
.dropdown-menu |
新增下拉選單容器的預設樣式 | 試一試 | 下拉選單 |
.dropdown-menu-right |
右對齊下拉選單 | 試一試 | 下拉選單 |
.dropdown-toggle |
用於應隱藏和顯示 (切換) 下拉選單的按鈕 | 試一試 | 下拉選單 |
.dropup |
表示一個向上彈出的選單 (而不是向下) | 試一試 | 下拉選單 |
.embed-responsive |
嵌入內容的容器。使影片或幻燈片在任何裝置上都能正確縮放 | 試一試 | 圖片 |
.embed-responsive-16by9 |
嵌入內容的容器。建立 16:9 寬高比的嵌入內容 | 試一試 | 圖片 |
.embed-responsive-4by3 |
嵌入內容的容器。建立 4:3 寬高比的嵌入內容 | 試一試 | 圖片 |
.embed-responsive-item |
用於 .embed-responsive 內部。將影片很好地縮放到父元素 |
試一試 | 圖片 |
.fade |
關閉警告框時新增淡出效果 | 試一試 | 提醒框 |
.form-control |
用於 input、textarea 和 select 元素,使其跨越頁面的整個寬度並保持響應性 | 試一試 | 表單 |
.form-control-feedback |
表單驗證類 | 試一試 | 輸入框 2 |
.form-control-static |
在水平表單中,在表單標籤旁邊新增純文字 | 試一試 | 輸入框 2 |
.form-group |
表單輸入和標籤的容器 | 試一試 | 表單 |
.form-inline |
使 <form> 左對齊,具有內聯塊控制元件(這僅適用於視口寬度至少為 768px 的表單) | 試一試 | 表單 |
.form-horizontal |
在水平佈局中排列標籤和表單控制元件組 | 試一試 | 表單 |
.glyphicon |
建立一個圖示。Bootstrap 提供了來自 Glyphicons Halflings 集合的 260 個免費的 glyphicons | 試一試 | Glyphicons |
.has-danger |
為標籤新增紅色,為輸入框新增紅色邊框,並在輸入框內新增錯誤圖示 (與 .has-feedback 一起使用) |
試一試 | 表單 |
.has-feedback |
為輸入框新增反饋圖示 (勾、警告和錯誤符號) | 試一試 | 表單 |
.has-success |
為標籤新增綠色,為輸入框新增綠色邊框,並在輸入框內新增勾圖示 (與 .has-feedback 一起使用) |
試一試 | 表單 |
.has-warning |
為標籤新增黃色/橙色,為輸入框新增黃色/橙色邊框,並在輸入框內新增勾圖示 (與 .has-feedback 一起使用) |
試一試 | 表單 |
.help-block |
一段幫助文字,會換行,並且可能超過一行。 | 試一試 | 輸入框尺寸 |
.hidden |
強制隱藏元素 (display:none ) |
試一試 | 輔助類 |
.hidden-* |
根據螢幕尺寸隱藏內容 | 試一試 | 輔助類 |
.hide |
已棄用。 使用 .hidden 代替 |
試一試 | 輔助類 |
.h1 - .h6 |
使元素看起來像指定類別的標題 (h1-h6) | 試一試 | 排版 |
.icon-bar |
在導航欄中使用,建立漢堡選單 (三條水平線) | 試一試 | 導航欄 |
.icon-next |
Unicode 圖示 (指向右箭頭的圖示),用於輪播。這通常被 glyphicon 替換 | 試一試 | 輪播 |
.icon-prev |
Unicode 圖示 (指向左箭頭的圖示),用於輪播。這通常被 glyphicon 替換 | 試一試 | 輪播 |
.img-circle |
將影像塑造成圓形 (不支援 IE8 及更早版本) | 試一試 | 圖片 |
.img-responsive |
使影像響應式 | 試一試 | 圖片 |
.img-rounded |
為影像新增圓角 | 試一試 | 圖片 |
.img-thumbnail |
將影像塑造成縮圖 (邊框) | 試一試 | 圖片 |
.in |
淡入選項卡 | 試一試 | 標籤頁 |
.info |
為表格行 (<tr> ) 或表格單元格 (<td> ) 新增淺藍色背景。指示中性資訊性更改或操作 |
試一試 | 表格 |
.initialism |
顯示 <abbr> 元素中的文字,字型大小略小 |
試一試 | 排版 |
.input-group |
容器,透過在輸入框前面或後面新增圖示、文字或按鈕作為“幫助文字”來增強輸入框 | 試一試 | 輸入框 |
.input-group-lg |
大型輸入組 | 試一試 | 輸入框 |
.input-group-sm |
小型輸入組 | 試一試 | 輸入框 |
.input-group-addon |
與 .input-group 類一起使用,使在輸入欄位旁邊新增圖示或幫助文字成為可能 |
試一試 | 輸入框 |
.input-group-btn |
與 .input-group 類一起使用,將按鈕附加到輸入框旁邊。通常用作搜尋欄 |
試一試 | 輸入框 |
.input-lg |
大型輸入欄位 | 試一試 | 輸入框尺寸 |
.input-sm |
小型輸入欄位 | 試一試 | 輸入框尺寸 |
.invisible |
使元素不可見 (visibility:hidden )。注意: 即使元素不可見,它仍會佔用頁面上的空間 |
試一試 | 輔助類 |
.item |
新增到每個輪播專案的類。可以是文字或影像 | 試一試 | 輪播 |
.jumbotron |
建立一個帶填充的灰色框,帶有圓角,並增大其中文字的字型大小。建立一個大框,以特別引起人們對某些特殊內容或資訊的注意 | 試一試 | Jumbotron |
.label |
為元素新增灰色圓角框。提供有關某事的額外資訊 (例如,“New”) | 試一試 | 標籤 |
.label-danger |
紅色標籤 | 試一試 | 標籤 |
.label-info |
淺藍色標籤 | 試一試 | 標籤 |
.label-success |
綠色標籤 | 試一試 | 標籤 |
.label-warning |
黃色標籤 | 試一試 | 標籤 |
.lead |
增大段落的字型大小和行高 | 試一試 | 排版 |
.left |
用於標識左側輪播控制元件 | 試一試 | 輪播 |
.list-group |
為 <li> 元素建立帶邊框的列表組 |
試一試 | 列表組 |
.list-group-item |
新增到列表組中的每個 <li> 元素 |
試一試 | 列表組 |
.list-group-item-heading |
建立列表組標題 (用於 <li> 以外的元素) |
試一試 | 列表組 |
.list-group-item-text |
用於列表組內的專案文字 (用於 <li> 以外的元素) |
試一試 | 列表組 |
.list-group-item-danger |
列表組中列表項的紅色背景色 | 試一試 | 列表組 |
.list-group-item-info |
列表組中列表項的淺藍色背景色 | 試一試 | 列表組 |
.list-group-item-success |
列表組中列表項的綠色背景色 | 試一試 | 列表組 |
.list-group-item-warning |
列表組中列表項的黃色背景色 | 試一試 | 列表組 |
.list-inline |
將所有列表項放在單行上 (水平選單) | 試一試 | 標籤頁 |
.list-unstyled |
刪除 <ul> 或 <ol> 列表的所有預設列表樣式 (專案符號、左邊距等) |
試一試 | 排版 |
.mark |
高亮文字:高亮文字 | 試一試 | 排版 |
.media |
排列媒體物件 (如影像或影片 - 通常用於部落格文章中的評論等) | 試一試 | 媒體物件 |
.media-body |
應出現在媒體物件旁邊的文字 | 試一試 | 媒體物件 |
.media-heading |
在媒體物件內建立標題 | 試一試 | 媒體物件 |
.media-list |
巢狀媒體列表 | 試一試 | 媒體物件 |
.media-object |
表示一個媒體物件 (影像或影片) | 試一試 | 媒體物件 |
.modal |
標識內容為模態框並將其焦點置於其上 | 試一試 | 模態框 |
.modal-body |
定義模態框正文的樣式。在此處新增任何 HTML 標記 (p, img, 等) | 試一試 | 模態框 |
.modal-content |
設定模態框的樣式 (邊框、背景色等)。在此內部,如果需要,新增模態框的標題、正文和頁尾 | 試一試 | 模態框 |
.modal-dialog |
設定模態框的正確寬度和邊距 | 試一試 | 模態框 |
.modal-footer |
模態框的頁尾 (通常包含一個操作按鈕和一個關閉按鈕) | 試一試 | 模態框 |
.modal-header |
模態框的標題 (通常包含一個標題和一個關閉按鈕) | 試一試 | 模態框 |
.modal-lg |
大模態框 (比預設的寬) | 試一試 | 模態框 |
.modal-open |
在 <body> 元素上使用,以防止頁面滾動 (overflow:hidden ) |
試一試 | 模態框 |
.modal-sm |
小模態框 (寬度較小) | 試一試 | 模態框 |
.modal-title |
模態框的標題 | 試一試 | 模態框 |
.nav nav-tabs |
表示一個選項卡選單 | 試一試 | 標籤頁 |
.nav nav-pills |
表示一個藥丸選單 | 試一試 | 標籤頁 |
.nav .navbar-nav |
用於包含導航欄中連結列表項的 <ul> 容器 |
試一試 | 導航欄 |
.nav-justified |
居中選項卡/藥丸。請注意,在螢幕小於 768px 時,專案會堆疊 (內容將保持居中) | 試一試 | 標籤頁 |
.nav-stacked |
垂直堆疊選項卡或藥丸 | 試一試 | 標籤頁 |
.nav-tabs |
建立一個選項卡選單 | 試一試 | 標籤頁 |
.navbar |
建立導航欄 | 試一試 | 導航欄 |
.navbar-brand |
新增到導航欄內的連結或標題元素,用以表示 Logo 或標題 | 試一試 | 導航欄 |
.navbar-btn |
在導航欄內垂直對齊按鈕 | 試一試 | 導航欄 |
.navbar-collapse |
摺疊導航欄(在手機和小平板電腦上隱藏,並替換為選單/漢堡圖示) | 試一試 | 導航欄 |
.navbar-default |
建立一個預設導航欄 (淺灰色背景色) | 試一試 | 導航欄 |
.navbar-fixed-bottom |
使導航欄保持在螢幕底部 (固定/粘滯) | 試一試 | 導航欄 |
.navbar-fixed-top |
使導航欄保持在螢幕頂部 (固定/粘滯) | 試一試 | 導航欄 |
.navbar-form |
新增到導航欄內的表單元素,以在垂直方向上居中它們 (適當的填充) | 試一試 | 導航欄 |
.navbar-header |
新增到包含代表徽標或標題的連結/元素的容器元素 | 試一試 | 導航欄 |
.navbar-inverse |
建立一個黑色導航欄 (而不是淺灰色) | 試一試 | 導航欄 |
.navbar-left |
在導航欄中將導航連結、表單、按鈕或文字左對齊 | 試一試 | 導航欄 |
.navbar-link |
樣式化元素,使其在導航欄中看起來像連結 (錨點在懸停時具有適當的填充和下劃線,而其他元素如 p 或 span 在懸停時有預設效果 - 在反轉導航欄中為白色,在預設導航欄中為黑色) | 試一試 | 導航欄 |
.navbar-nav |
用於包含導航欄中連結列表項的 <ul> 容器 |
試一試 | 導航欄 |
.navbar-right |
在導航欄中將導航連結、表單、按鈕或文字右對齊。 | 試一試 | 導航欄 |
.navbar-static-top |
移除導航欄的左、上和右邊框 (圓角) (預設導航欄具有灰色邊框和 4px 的 border-radius) | 試一試 | 導航欄 |
.navbar-text |
垂直對齊導航欄中的任何非連結元素 (確保適當的填充) | 試一試 | 導航欄 |
.navbar-toggle |
樣式化在小螢幕上應開啟導航欄的按鈕。通常與三個 .icon-bar 類一起使用,以指示一個可切換選單圖示 (漢堡包/條形) |
試一試 | 導航欄 |
.next |
在輪播中用於標識下一個控制元件 | 試一試 | 輪播 |
.next |
用於將分頁按鈕對齊到頁面右側 (下一個按鈕) | 試一試 | 分頁 |
.page-header |
在標題下方新增一條水平線 (+ 在元素周圍新增一些額外空間) | 試一試 | 頁面標題 |
.pager |
建立上一頁/下一頁按鈕 (用於 <ul> 元素) |
試一試 | 分頁 |
.pagination |
建立分頁 (當您有一個包含大量頁面的網站時很有用。用於 <ul> 元素) |
試一試 | 分頁 |
.pagination-lg |
大分頁 (每個分頁連結的字型大小為 18px。預設是 14px) | 試一試 | 分頁 |
.pagination-sm |
小分頁 (每個分頁連結的字型大小為 12px。預設是 14px) | 試一試 | 分頁 |
.panel |
建立一個帶邊框的框,其內容周圍有填充 | 試一試 | 面板 |
.panel-body |
面板內內容的容器 | 試一試 | 面板 |
.panel-collapse |
可摺疊面板 (在隱藏和顯示面板之間切換) | 試一試 | 摺疊 |
.panel-danger |
紅色面板。表示危險 | 試一試 | 面板 |
.panel-info |
淺藍色面板。表示資訊 | 試一試 | 面板 |
.panel-success |
綠色面板。表示成功 | 試一試 | 面板 |
.panel-warning |
黃色面板。表示警告 | 試一試 | 面板 |
.panel-footer |
建立一個面板頁尾 (淺背景色) | 試一試 | 面板 |
.panel-group |
用於將多個面板分組。這將刪除每個面板下方的邊距 | 試一試 | 面板 |
.panel-heading |
建立一個面板標題 (淺背景色) | 試一試 | 面板 |
.panel-title |
用於 .panel-heading 內部,以調整文字樣式 (刪除邊距並設定字型大小為 16px) |
試一試 | 面板 |
.popover |
當用戶單擊元素時出現的彈出框 | 試一試 | Popover |
.pre-scrollable |
使 <pre> 元素可滾動 (max-height 為 350px 並提供 y 軸捲軸) |
試一試 | 輔助類 |
.prev |
在輪播中用於標識“上一個”連結 | 試一試 | 輪播 |
.previous |
用於將分頁按鈕對齊到頁面左側 (上一個按鈕) | 試一試 | 分頁 |
.progress |
進度條的容器 | 試一試 | 進度條 |
.progress-bar |
建立一個進度條 | 試一試 | 進度條 |
.progress-bar-danger |
紅色進度條。表示危險 | 試一試 | 進度條 |
.progress-bar-info |
淺藍色進度條。表示資訊 | 試一試 | 進度條 |
.progress-bar-striped |
建立一個條紋進度條 | 試一試 | 進度條 |
.progress-bar-success |
綠色進度條。表示成功 | 試一試 | 進度條 |
.progress-bar-warning |
黃色進度條。表示警告 | 試一試 | 進度條 |
.pull-left |
將元素浮動到左側 | 試一試 | 輔助類 |
.pull-right |
將元素浮動到右側 | 試一試 | 輔助類 |
.right |
用於標識右側輪播控制元件 | 試一試 | 輪播 |
.row |
響應式列的容器 | 試一試 | Grid |
.row-no-gutters |
移除行及其列之間的間隙 | 試一試 | Grid |
.show |
顯示元素 (display:block) |
試一試 | 輔助類 |
.small |
在任何標題中建立較淺、次要的文字 | 試一試 | 排版 |
.sr-only |
隱藏除螢幕閱讀器以外的所有裝置上的文字 | 試一試 | 輔助類 |
.sr-only-focusable |
隱藏除螢幕閱讀器以外的所有裝置上的文字 | 試一試 | 輔助類 |
.success |
為表格行 (<tr> ) 或表格單元格 (<td> ) 新增綠色背景。表示成功或積極的操作 |
試一試 | 表格 |
.tab-content |
與 .tab-pane 一起使用,建立可切換/動態的選項卡/藥丸 |
試一試 | 標籤頁 |
.tab-pane |
與 .tab-content 一起使用,建立可切換/動態的選項卡/藥丸 |
試一試 | 標籤頁 |
.table |
為表格新增基本樣式 (填充、底部邊框等) | 試一試 | 表格 |
.table-bordered |
為表格和單元格的所有邊新增邊框 | 試一試 | 表格 |
.table-condensed |
透過將單元格填充減半,使表格更緊湊 | 試一試 | 表格 |
.table-hover |
建立可懸停的表格 (在表格行懸停時新增灰色背景色) | 試一試 | 表格 |
.table-responsive |
使表格響應式 (在需要時新增水平捲軸) | 試一試 | 表格 |
.text-capitalize |
表示大寫文字 | 試一試 | 排版 |
.text-center |
居中文字 | 試一試 | 排版 |
.text-danger |
紅色文字顏色。表示危險 | 試一試 | 排版 |
.text-hide |
隱藏文字 (有助於將元素的文字內容替換為背景影像) | 試一試 | 排版 |
.text-info |
淺藍色文字顏色。表示資訊 | 試一試 | 排版 |
.text-justify |
表示兩端對齊文字 | 試一試 | 排版 |
.text-left |
文字左對齊 | 試一試 | 排版 |
.text-lowercase |
將文字轉換為小寫 | 試一試 | 排版 |
.text-muted |
灰色文字顏色 | 試一試 | 排版 |
.text-nowrap |
防止文字換行 | 試一試 | 排版 |
.text-primary |
藍色文字顏色 | 試一試 | 排版 |
.text-right |
文字右對齊 | 試一試 | 排版 |
.text-success |
綠色文字顏色。表示成功 | 試一試 | 排版 |
.text-uppercase |
將文字轉換為大寫 | 試一試 | 排版 |
.text-warning |
黃色/橙色文字顏色。表示警告 | 試一試 | 排版 |
.thumbnail |
在元素 (通常是影像或影片) 周圍新增邊框,使其看起來像縮圖 | 試一試 | 圖片 |
.tooltip |
當用戶將滑鼠指標懸停在元素上時出現的彈出框 | 試一試 | Tooltip |
.visible-* |
從 v3.2.0 開始棄用。 用於按裝置顯示和/或隱藏內容。注意: 使用 .hidden-* 代替 |
試一試 | 輔助類 |
.visible-print-block |
在列印 (預) 檢視中顯示元素 (display:block ) |
輔助類 | |
.visible-print-inline |
在列印 (預) 檢視中顯示元素 (display:inline ) |
輔助類 | |
.visible-print-inline-block |
在列印 (預) 檢視中顯示元素 (display:inline-block ) |
輔助類 | |
.hidden-print |
在列印 (預) 檢視中隱藏元素 (display:none ) |
輔助類 | |
.warning |
為表格行 (<tr> ) 或表格單元格 (<td> ) 新增黃色背景。表示警告 |
試一試 | 表格 |
.well |
在元素周圍新增圓角邊框,帶有灰色背景色和一些填充 | 試一試 | Wells |
.well-lg |
大 well (更多填充) | 試一試 | Wells |
.well-sm |
小 well (較少填充) | 試一試 | Wells |
上表顯示了所有可用的 Bootstrap 3 類。
提示: 要檢視所有Bootstrap 4 類的完整列表,請訪問我們的 所有 Bootstrap 4 CSS 類參考。