强制表格单元格进入新行

时间:2016-11-12 22:45:29

标签: html css html-table

我有一个标准表,其中单元格在同一行中从左到右显示,但我想强制第三个单元格出现在新行上。是否有CSS调整可以做到这一点?

<table><tr>
<td class="col-1">One</td>
<td class="col-2">Two</td>
<td class="col-3">Three</td>
<td class="col-4">Four</td>
</tr></table>

显示为:One Two Three Four

我可以强制第三列显示在新行上:

One Two
Three Four

2 个答案:

答案 0 :(得分:2)

不完全确定为什么你不会让它成为一个新行,但我想如果你使用CSS,你可以这样做:

table tr td {
  display: block;
  width: 50%;
  box-sizing: border-box;
  float: left;
}

JSFiddle

答案 1 :(得分:0)

您可以使用Offers包裹td来创建新行

&#13;
&#13;
tr
&#13;
&#13;
&#13;

希望这有帮助!