手機(jī)也能上課
1/13
表格
表格是 Bootstrap 的一個(gè)基礎(chǔ)組件之一,
在使用 Bootstrap 的表格過程中,只需要添加對(duì)應(yīng)的類名就可以得到不同的表格風(fēng)格。
下表列出了 Bootstrap 為表格不同的樣式風(fēng)格提供的一些類:
類名 | 描述 |
---|---|
.table
|
基本的表格
|
.table-striped
|
條紋狀表格 |
.table-bordered
|
帶邊框的表格
|
.table-hover
|
當(dāng)指針懸停在行上時(shí)會(huì)實(shí)現(xiàn)背景效果的表格
|
.table-condensed
|
緊湊型表格
|
.table-responsive
|
響應(yīng)式表格 |
條紋狀表格其效果與基礎(chǔ)表格相比,僅是在 tbody 隔行有一個(gè)淺灰色的背景色。
表格效果需要基于基本格式 .table
緊湊型表格與基礎(chǔ)表格差別不大,只是將單元格的內(nèi)距由 8px 調(diào)至 5px 。
表格效果需要基于基本格式 .table
將任何.table
元素包裹在.table-responsive
元素內(nèi),即可創(chuàng)建響應(yīng)式表格。
其會(huì)在小屏幕設(shè)備上(小于768px)水平滾動(dòng),當(dāng)屏幕大于 768px 寬度時(shí),水平滾動(dòng)條消失。