久久精品中文字幕av,av.涩涩涩涩涩涩涩涩,亚洲国产日韩欧美精品成人久久久,成人福利电影免费在线观看,日产国产原创av,日韩av午夜激情,bt天堂中文字幕,超级碰人妻在线视频,欧美老熟妇久久一区二区

## 表格 **基本實(shí)例** 給任意 \<table\> 標(biāo)簽添加類(lèi) .table 可以給表格添加基本的樣式 — 少量的內(nèi)補(bǔ)（padding）和水平方向的分隔線。 實(shí)例： ```html <table class="table"> <tr> <th>#</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr> <tr> <td>1</td> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr> <td>2</td> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> </table> ```  ***** **條紋狀表格** 通過(guò)`.table-striped`類(lèi)可以給`<tbody>`之內(nèi)的每一行增加斑馬條紋樣式，也就是隔行變色。 實(shí)例： ```html <table class="table table-striped"> <tr> <th>#</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr> <tr> <td>1</td> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr> <td>2</td> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> </table> ```  ***** **帶邊框的表格** 添加`.table-bordered`類(lèi)為表格和其中的每個(gè)單元格增加邊框。 實(shí)例： ```html <table class="table table-striped table-bordered"> <tr> <th>#</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr> <tr> <td>1</td> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr> <td>2</td> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> </table> ```  ***** **鼠標(biāo)懸停** 通過(guò)添加`.table-hover`類(lèi)可以讓`<tbody>`中的每一行對(duì)鼠標(biāo)懸停狀態(tài)作出響應(yīng)。 實(shí)例： ```html <table class="table table-bordered table-hover"> <tr> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr> <tr> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> </table> ```  鼠標(biāo)移入當(dāng)前行會(huì)改變當(dāng)前行的背景色。 ***** **緊縮表格** 通過(guò)添加`.table-condensed`類(lèi)可以讓表格更加緊湊，單元格中的內(nèi)補(bǔ)（padding）均會(huì)減半。 實(shí)例： ```html <table class="table table-bordered table-condensed"> <tr> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr> <tr> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> </table> ```  ***** **狀態(tài)類(lèi)** 通過(guò)這些狀態(tài)類(lèi)可以為行或單元格設(shè)置顏色。 | class | 描述 | | --- | --- | | `.active` | 鼠標(biāo)懸停在行或單元格上時(shí)所設(shè)置的顏色 | | `.success` | 標(biāo)識(shí)成功或積極的動(dòng)作 | | `.info` | 標(biāo)識(shí)普通的提示信息或動(dòng)作 | | `.warning` | 標(biāo)識(shí)警告或需要用戶注意 | | `.danger` | 標(biāo)識(shí)危險(xiǎn)或潛在的帶來(lái)負(fù)面影響的動(dòng)作| 實(shí)例: ```html <table class="table table-bordered table-condensed"> <tr> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr> <tr class="active"> <th>1</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="success"> <th>2</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="info"> <th>3</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="warning"> <th>4</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="danger"> <th>5</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> </table> ```  通過(guò)為表格中的一行或一個(gè)單元格添加顏色，給瀏覽網(wǎng)頁(yè)的用戶提供不同類(lèi)型的信息 ***** **響應(yīng)式表格** 將任何`.table`元素包裹在`.table-responsive`元素內(nèi)，即可創(chuàng)建響應(yīng)式表格，其會(huì)在小屏幕設(shè)備上（小于768px）水平滾動(dòng)。當(dāng)屏幕大于 768px 寬度時(shí)，水平滾動(dòng)條消失。注意：列數(shù)必須大于等于6列才有效果。 實(shí)例: ```html <div class="container"> <div class="table-responsive"> <table class="table table-bordered table-condensed"> <tr> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> <th>表格標(biāo)題</th> </tr> <tr class="active"> <th>1</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="success"> <th>2</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="info"> <th>3</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="warning"> <th>4</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> <tr class="danger"> <th>5</th> <td>表格單元</td> <td>表格單元</td> <td>表格單元</td> </tr> </table> </div> </div> ```