CSS中

Question

有没有办法将表转换为Bootstrap网格，而不使用CSS。我无法使用jquery来重写标签，因为该表还有另外一个附带事件的JavaScript等。

我想要完成单元格堆叠在xs设备上。

自：

<table class="table table-bordered">
    <tbody>
        <tr>
            <td>cell11</td>
            <td>cell12</td>
            <td>cell13 Lorem ipsum ... magna aliquyam</td>
            <td>cell14 Li Europan ... li existent Europan</td>
        </tr>
        ...
    </tbody>
</table>

致：

<div class="col-xs-12 table-bordered gridtable">
    <div class="row">
        <div class="col-xs-6 col-md-1">cell11</div>
        <div class="col-xs-6 col-md-1">cell12</div>
        <div class="col-md-4">cell13 Lorem ipsum ... magna aliquyam</div>
        <div class="col-md-6">cell14 Li Europan ... existent Europan</div>
    </div>
    ...
</div>

我创建了一个小型演示http://www.bootply.com/sRZF3LfHPU

• 上面是我得到的那种表。

• 下半部分是我要存档的外观。将宽度减小到xs-device级别以查看差异。

这与How to use Bootstrap 3 grid system with table component?不重复，因为在该答案中，单元格不会叠加。