Bootstrap表格样式使用方法

基本Bootstrap表格样式

Bootstrap最基本的表格样式就是在<table>标签中加入table类，然后在标签内嵌套thead和tbody元素即可。
例如：<table class="table"><thead><tr><th>表头</th></tr></thead><tbody><tr><td>表格内容</td></tr></tbody></table>按照这种形式构建的表格是最为基础的。

间隔型Bootstrap表格样式

这种表格样式是采用不同的tr背景来进行区分，如果想要使用这个样式，需要在table中再加入table-striped类，例如：<table class="table table-striped"></table>
这种样式更为简单大方，重要的是行之间区分很明显。

边框型Bootstrap表格样式

默认的table样式是不带边框的，加入table-bordered类会给表格加上边框，例如：<table class="table table-bordered"></table>

鼠标悬停交互表格样式

如果想要加入一定的交互效果，也就是hover到某一行的时候背景变色，那么可以引入table-hover的样式，从而有更好的用户体验，例如：<table class="table table-hover"></table>

紧凑表格样式

如果你认为目前的表格样式结构过为松散，那么可以加入Bootstrap提供的类，从而让表格更为紧凑，例如：<table class="table table-condensed"></table>