编写自定义引导表

时间:2015-09-10 04:42:42

标签: html twitter-bootstrap

我需要编写一个自举表,如图所示:

img
我写了一段代码like this.
HTML:

<table class="table table-bordered text-center table-responsive">
    <thead>
        <th class="text-center" width="30%">Modules</th>
        <th class="text-center" width="70%">Previlages</th>
    </thead>
    <tbody>
        <tr>
            <td>Hello</td>
            <td><input type="checkbox" class="form-control"></td>
        </tr>
    </tbody>
</table>  

但这不符合要求。如何创建自定义表格如图所示?

1 个答案:

答案 0 :(得分:0)

试试这个..

<强> HTML

<table class="table table-bordered text-center table-responsive">
    <thead>
        <th class="text-center" width="30%">Modules</th>
        <th colspan="4" class="text-center" width="70%">Previlages</th>
    </thead>
    <tbody>
        <tr>
            <td></td>
            <td>Add</td>
            <td>Edit</td>
            <td>Delete</td>
            <td>View</td>
        </tr>
        <tr>
          <td>User</td>
          <td><input type="checkbox" class="form-control"></td>
          <td><input type="checkbox" class="form-control"></td>
          <td><input type="checkbox" class="form-control"></td>
          <td><input type="checkbox" class="form-control"></td>
        </tr>
    </tbody>
</table>