Bootstrap table表格簡(jiǎn)單操作

更新時(shí)間：2017年02月07日 09:21:00 作者：逆方向

這篇文章主要為大家詳細(xì)介紹了Bootstrap table表格簡(jiǎn)單操作的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下

Bootstrap table表格簡(jiǎn)單實(shí)例分享給大家，供大家參考，具體內(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. 代碼實(shí)現(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.頁面效果

以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

JS插件overlib用法實(shí)例詳解
這篇文章主要介紹了overlib用法,結(jié)合實(shí)例較為詳細(xì)的分析了JavaScript插件overlib的相關(guān)使用技巧,需要的朋友可以參考下
2015-12-12
微信小程序API—獲取定位的詳解
這篇文章主要介紹了微信小程序API獲取定位，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-04-04
javascript獲取不重復(fù)的隨機(jī)數(shù)的方法比較
js永不重復(fù)隨機(jī)數(shù)實(shí)現(xiàn)代碼比較
2008-09-09
js 處理URL實(shí)用技巧
escape()、encodeURI()、encodeURIComponent()三種方法都能對(duì)一些影響URL完整性的特殊字符進(jìn)行過濾。
2010-11-11
JS+DIV實(shí)現(xiàn)鼠標(biāo)劃過切換層效果的實(shí)例代碼
這篇文章主要是對(duì)JS+DIV實(shí)現(xiàn)鼠標(biāo)劃過切換層效果的實(shí)例代碼進(jìn)行了詳細(xì)的介紹，需要的朋友可以過來參考下，希望對(duì)大家有所幫助
2013-11-11
js實(shí)現(xiàn)當(dāng)復(fù)選框選擇匿名登錄時(shí)隱藏登錄框效果
這篇文章主要介紹了js實(shí)現(xiàn)當(dāng)復(fù)選框選擇匿名登錄時(shí)隱藏登錄框效果,實(shí)例分析了javascript動(dòng)態(tài)操作頁面元素樣式的相關(guān)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下
2015-08-08
微信小程序事件流原理解析
這篇文章主要介紹了微信小程序事件流原理解析,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2019-11-11
原生微信小程序/uniapp使用空格占位符無效的解決辦法
最近需要在字體中間加空白占位符,在嘗試使用之后,還是不能使用,下面這篇文章主要給大家介紹了關(guān)于原生微信小程序/uniapp使用空格占位符無效的解決辦法,需要的朋友可以參考下
2023-02-02
JavaScript 判斷對(duì)象中是否有某屬性的常用方法
判斷對(duì)象中是否有某屬性的常見方式總結(jié)，不同的場(chǎng)景要使用不同的方式。這篇文章給大家介紹了JavaScript 判斷對(duì)象中是否有某屬性的常用方法，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧
2018-06-06
JavaScript事件處理的方式(三種)
最近這段時(shí)間因?yàn)槊刻煲薷木W(wǎng)站，為網(wǎng)站做特效，所以看了很多的js接觸事件，自己只會(huì)使用一小部分，有時(shí)用的時(shí)候也比較混亂，現(xiàn)在系統(tǒng)的整理了一下，特此分享到腳本之家平臺(tái)供大家參考下
2016-04-04