利用bootstrap快速创建一个美观的table表单

1.添加 .table-bordered 类为表格和其中的每个单元格增加边框。

2.通过 .table-striped 类可以给 <tbody> 之内的每一行增加斑马条纹样式。

3.通过添加 .table-hover 类可以让 <tbody> 中的每一行对鼠标悬停状态作出响应。

4.例子如下，需要引入bootstrap的js和css文件

<table class="table table-striped table-bordered table-hover" style="width: 90%;margin-left: 5%;">
            <thead>
                <tr>
                    <td>姓名</td>
                    <td>性别</td>
                </tr>
            </thead>
            <tbody>
                <tr class="active">
                    <td>active</td>
                    <td>男</td>
                </tr>
                <tr class="success">
                    <td>success</td>
                    <td>女</td>
                </tr>
                <tr class="info">
                    <td>info</td>
                    <td>男</td>
                </tr>
                <tr class="warning">
                    <td>warning</td>
                    <td>男</td>
                </tr>
                <tr class="danger">
                    <td>danger</td>
                    <td>男</td>
                </tr>
            </tbody>
        </table>

5.

.active	鼠标悬停在行或单元格上时所设置的颜色
.success	标识成功或积极的动作
.info	标识普通的提示信息或动作
.warning	标识警告或需要用户注意
.danger	标识危险或潜在的带来负面影响的动作