Bootstrap table表格簡單操作
Bootstrap table表格簡單實例分享給大家,供大家參考,具體內(nèi)容如下
使用類 Class="table" 既可讓table美化樣式
table 相關(guān)的Class
隔行換色 : table-striped
鼠標(biāo)懸停效果: table-hover
表格的邊框:table-bordered
表頭顏色:class="danger" Success 等幾種顏色
1.頁面添加引用
<script src="../Bootstrap/jquery-3.1.1.js"></script> <script src="../Bootstrap/js/bootstrap.min.js"></script> <link href="../Bootstrap/css/bootstrap.min.css" rel="external nofollow" rel="stylesheet" />
2. 代碼實現(xiàn)
<table class="table table-striped table-hover table-bordered">
<thead>
<tr class="danger"> <%--表頭顏色--%>
<td>姓名</td>
<td>年齡</td>
<td>性別</td>
</tr>
</thead>
<tbody>
<tr>
<td>張三</td>
<td>20</td>
<td>男</td>
</tr>
</tbody>
</table>
3.頁面效果

以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
微信小程序之滑動頁面隱藏和顯示組件功能的實現(xiàn)代碼
這篇文章主要介紹了微信小程序之滑動頁面隱藏和顯示組件功能,本文通過實例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2020-06-06
bootstrap使用validate實現(xiàn)簡單校驗功能
這篇文章主要為大家詳細(xì)介紹了bootstrap使用validate實現(xiàn)簡單校驗功能,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-12-12
JS正則表達(dá)式修飾符中multiline(/m)用法分析
這篇文章主要介紹了JS正則表達(dá)式修飾符中multiline(/m)用法,結(jié)合實例形式分析了JS正則中多行模式multiline的功能、使用方法與相關(guān)注意事項,需要的朋友可以參考下2016-12-12
uniapp與webview之間的相互傳值的實現(xiàn)
這篇文章主要介紹了uniapp與webview之間的相互傳值的實現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-06-06

