襄陽(yáng)網(wǎng)站建設(shè)|Bootstrap 表格
Bootstrap 提供了一個(gè)清晰的創(chuàng)建表格的布局。下表列出了 Bootstrap 支持的一些表格元素:
標(biāo)簽 | 描述 |
---|---|
<table> | 為表格添加基礎(chǔ)樣式。 |
<thead> | 表格標(biāo)題行的容器元素(<tr>),用來(lái)標(biāo)識(shí)表格列。 |
<tbody> | 表格主體中的表格行的容器元素(<tr>)。 |
<tr> | 一組出現(xiàn)在單行上的表格單元格的容器元素(<td> 或 <th>)。 |
<td> | 默認(rèn)的表格單元格。 |
<th> | 特殊的表格單元格,用來(lái)標(biāo)識(shí)列或行(取決于范圍和位置)。必須在 <thead> 內(nèi)使用。 |
<caption> | 關(guān)于表格存儲(chǔ)內(nèi)容的描述或總結(jié)。 |
表格類(lèi)
下表樣式可用于表格中:
類(lèi) | 描述 | 實(shí)例 |
---|---|---|
.table | 為任意 <table> 添加基本樣式 (只有橫向分隔線(xiàn)) | 嘗試一下 |
.table-striped | 在 <tbody> 內(nèi)添加斑馬線(xiàn)形式的條紋 ( IE8 不支持) | 嘗試一下 |
.table-bordered | 為所有表格的單元格添加邊框 | 嘗試一下 |
.table-hover | 在 <tbody> 內(nèi)的任一行啟用鼠標(biāo)懸停狀態(tài) | 嘗試一下 |
.table-condensed | 讓表格更加緊湊 | 嘗試一下 |
聯(lián)合使用所有表格類(lèi) | 嘗試一下 |
<tr>, <th> 和 <td> 類(lèi)
下表的類(lèi)可用于表格的行或者單元格:
類(lèi) | 描述 | 實(shí)例 |
---|---|---|
.active | 將懸停的顏色應(yīng)用在行或者單元格上 | 嘗試一下 |
.success | 表示成功的操作 | 嘗試一下 |
.info | 表示信息變化的操作 | 嘗試一下 |
.warning | 表示一個(gè)警告的操作 | 嘗試一下 |
.danger | 表示一個(gè)危險(xiǎn)的操作 | 嘗試一下 |
關(guān)鍵詞: 襄陽(yáng)網(wǎng)站建設(shè) Bootstrap表格