下表列出了 Bootstrap 支持的一些表格元素：
表格類：
.table：為任意 <table> 添加基本樣式 (只有橫向分隔線)
.table-striped：在 <tbody> 內添加斑馬線形式的條紋 ( IE8 不支持)
.table-bordered：為所有表格的單元格添加邊框
.table-hover：在 <tbody> 內的任一行啟用鼠標懸停狀態
.table-condensed：讓表格更加緊湊
<tr>, <th> 和 <td> 類：
.active：將懸停的顏色應用在行或者單元格上
.success：表示成功的操作
.info：表示信息變化的操作
.warning：表示一個警告的操作
.danger：表示一個危險的操作
<table class="table"> <caption>上下文表格布局</caption> <thead> <tr> <th>產品</th> <th>付款日期</th> <th>狀態</th></tr> </thead> <tbody> <tr class="active"> <td>產品1</td> <td>23/11/2013</td> <td>待發貨</td></tr> <tr class="success"> <td>產品2</td> <td>10/11/2013</td> <td>發貨中</td></tr> <tr class="warning"> <td>產品3</td> <td>20/10/2013</td> <td>待確認</td></tr> <tr class="danger"> <td>產品4</td> <td>20/10/2013</td> <td>已退貨</td></tr> </tbody> </table>
響應式表格
通過把任意的 .table 包在 .table-responsive class 內，您可以讓表格水平滾動以適應小型設備（小于 768px）。當在大于 768px 寬的大型設備上查看時，您將看不到任何的差別。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持武林網。
新聞熱點
疑難解答
