溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
下表列出了 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 寬的大型設備上查看時，您將看不到任何的差別。
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持億速云。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
