CSS表响应 - 在另一列下堆叠列

Question

我正在创建一个表，并且想知道如何在最小化浏览器时将列移到另一列下面。

我想完成这样的事情：

Title1 | Title2
Info1  | Info2
-------|--------
       | Title3
       | Info3

原始状态：

Title1 | Title2 | Title3
Info1  | Info2  | Info3
-------|--------|------


<table>
  <thead>
    <tr>
      <th>
        Title1
      </th>
      <th>
        Title2
      </th>
      <th>
        Title3
      </th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        Info1
      </td>
      <td>
        Info2
      </td>
      <td>
        Info3
      </td>
    </tr>    
  </tbody>
</table>

这也需要用于电子邮件模板，因此需要有关允许样式在浏览器/电子邮件提供商/设备上工作的帮助