带有表格单元格的自举网格系统

Question

我有一个响应table，有三行，每行都有 三td。现在我希望在小型设备（＆lt; 768px）上将文本转换为 如果时间过长，第二个td会被包裹下来。

我在http://www.bootply.com/n17ZZ17gWd#上编写了这段代码，但是当我在移动预览上运行时，长文本总是放在一行上，而在全屏预览时，长文本会被包裹下来。

我用过td每个class="col-xs-1 col-sm-1 col-md-1，但也许 我误解了如何将col- *用于td，这是什么效果？

在实践中如果我有3 td并且我写了类似的东西：

<tr>
    <td class="col-xs-1"> ... </td>
    <td class="col-xs-1"> ... </td> 
    <td class="col-xs-1"> ... </td>
</tr>

我们如何阅读col-xs-1？

也许每个td跨越1列而tr仍然有9列空格？

或

每个td跨越1列，但每个td仍有11列空格？

Answer 1

不正是您所要求的，但see是否能为您提供任何线索。

col-xs-1 col-md-2
col-xs-12 col-md-8
col-xs-1 col-md-2

对于xs这样做是可以的，如果列数超过12，bootstrap会自动将它分配给单独的行。