响应式html表格

Question

我已经创建了一个具有以下结构的HTML表：

Title Text Title Text
Title Text Title Text

现在，在移动(<768px)上，它应该更改为：

Title Text
Title Text
Title Text
Title Text

这是可能的(最好没有jQuery)吗？

HTML (带Bootstrap)

<table class="table">
<tr>
    <th>Title Column 1</th>
    <td>Content Column 1</td>
    <th>itle Column 2</th>
    <td>Content Column 2</td>
</tr>
<tr>
    <th>Title Column 1</th>
    <td>Content Column 1</td>
    <th>itle Column 2</th>
    <td>Content Column 2</td>
</tr>
</table>

Answer 1

这就是你要的!

.table{ width:100%;}
.table tr , .table th{
  float:left;
 }