Html 一行多行

我有一张单人票。这一排可以是许多人的。是否有一种方法可以在新行中显示，当行已满时，不使用新行

例如：

<table>
 <tr>
  <td></td>
  <td></td>
  <td></td>
  <td></td> *line is full, new line*
  <td></td>
  <td></td>
 </tr>
</table>

将动态创建，在创建时，我不知道在哪里需要休息。那是我的问题。有没有一个css技巧，可以自动进行中断？

你可以试试这个：

<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
    <th>Savings for holiday!</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
    <td rowspan="2">$50</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>

---

当然有可能，但我一点也不推荐。最佳做法是添加新行

但是，要回答您的问题，请将单元格显示为块并将其向左浮动。然后在单元格中添加一个clear:left。这将是新行中的第一个单元格

请注意，使用这段代码会使表格布局变得松散，这意味着不同行中的单元格不会具有相似的宽度，请参见演示

运输署{ 显示：块； 浮动：左； 边框：1px纯灰； 填充：.5em； } 纽罗先生{ 清除：左； } 1. 2. 3. 4.内容更多 5. 6.

---

您可以使用flex display，这样，如果当前线路已满，td将自动转到新线路

我将使用div而不是表：

<div class="table">
<div class="tr">
    <div class="td">foo</div>
    <div class="td">foo</div>
    <div class="td">foo</div>
    <div class="td">foo</div> <!-- line is full, new line -->
    <div class="td">foo</div>
    <div class="td">foo</div>
</div>

编辑： 当然你可以浮动你的tds。如果使用此CSS，如果行太小，tds将显示在新行中：

/* Float elements */
td {
    float: left;
}

---

尝试引导，然后可以添加如下类：

<table>
 <tr class="col-md-12">
  <td class="col-md-3"></td>
  <td class="col-md-3"></td>
  <td class="col-md-3"></td>
  <td class="col-md-3"></td> *line is full, new line*
  <td class="col-md-3"></td>
  <td class="col-md-3"></td>
 </tr>
</table>

---

希望能有帮助。

你是说你有一张单曲，想要一条没有新曲的新线路，对吗？你为什么不加一个新行呢？有什么反对的？当然CSS也可以，让它们像块一样，浮动它们，并清除你想要的最后一个。但这太脏了。你是说你只有一排。为什么不使用多个tr和单个td呢。你有什么限制吗？我不知道你想做什么。但您始终可以在TDI上执行或rowspan属性，如果您在td上固定宽度，如果内容太长，它将创建一个新行…数据的数量将动态生成。这就是为什么我不能使用的原因。数据的数量将动态生成。这就是为什么我不能使用的原因。如果生成了该行，则该行可能包含的数据太多，无法在一行中显示。这就是为什么我需要一个自动的word Wrap数据将被动态创建，在创建时，我不知道我需要在哪里休息。那是我的问题。是否有一个css技巧，自动地做到这一点？

/* Float elements */
td {
    float: left;
}

<table>
 <tr class="col-md-12">
  <td class="col-md-3"></td>
  <td class="col-md-3"></td>
  <td class="col-md-3"></td>
  <td class="col-md-3"></td> *line is full, new line*
  <td class="col-md-3"></td>
  <td class="col-md-3"></td>
 </tr>
</table>