本文主要講解的是表格，這個其實對于做過網站的人來說，并不陌生，而且可以說是最為常用的各種列表的展示，有時候也會因為用戶或者老板的需求而感到頭疼。下面我們來看一下，Bootstrap已經為我們準備那些類型的表格呢?
基本案例
為任意
標簽添加.table可以為其賦予基本的樣式—少量的內補(padding)和水平方向的分隔線。這種方式看起來很多余!?但是我們覺得，表格元素使用的很廣泛，如果我們為其賦予默認樣式可能會影響例如日歷和日期選擇之類的插件，所以我們選擇將其樣式獨立出來。
一個簡單的Table示例
條紋狀表格
利用.table-striped可以給之內的每一樣增加斑馬條紋樣式。
在上面示例的table元素上再添加一個 樣式類
看現在的效果，還是有點變化的。
帶邊框的表格
利用.table-bordered為表格和其中的每個單元格增加邊框。
還是將第一個示例中的table元素上再添加一個樣式類
鼠標懸停
利用.table-hover可以讓中的每一行響應鼠標懸停狀態。
將鼠標移到那一行那一行就會有效果的
緊縮表格
利用.table-condensed可以讓表格更加緊湊，單元格中的內部(padding)均會減半。
這個效果沒那么明顯，主要就是單元格中內容padding減半了。
狀態Class
通過這些狀態class可以為行貨單元格設置顏色。
響應式表格
將任何.table包裹在.table-responsive中即可創建響應式表格，其會在小屏幕設備上(小于768px)水平滾動。當屏幕大于768px寬度時，水平滾動條消失。
看滾動條出現了額。
總結
簡簡單單的幾個樣式類，可以將頁面搞到這種程度，很不錯，以后再也不用愁調樣式了。
【網站聲明】本站除付費源碼經過測試外，其他素材未做測試，不保證完整性，網站上部分源碼僅限學習交流，請勿用于商業用途。如損害你的權益請聯系客服QQ：2655101040 給予處理，謝謝支持。