Question

我为客户转换了一些表格数据：

<table>
  <tr>
    <th><p>SPAGHETTI &ndash; Deeg voorgerechten</p></th>
  </tr>
  <tr>
    <td>SPAGHETTI AL PESCATORE</td>
    <td>&euro;11.50</td>
    <td><p  >Zeevruchten in speciale tomatensaus</p></td>
  </tr>
  <tr>
    <td>SPAGHETTI ALLA MATRICIANA</td>
    <td>&euro;9.25</td>
    <td><p  >Met spek, knoflook in tomatensaus</p></td>
  </tr>
  <tr>
    <td>SPAGHETTI BOSCAIOLA</td>
    <td>&euro;10.25
      </td>
    <td><p  >Met ham, spek, knoflook in roomsaus</p></td>
  </tr>
<table>

这是表格数据。它应该在表格中:)）

在doc这个词中，他将最后一个单元格（荷兰语描述）放在一个新行上。我可以将每个最后一个单元格正则表达为colspan =“2”的新行，但这不是结构。我试过了：

td:last-child {
  display: block;
}

但是每个浏览器都忽略了这一点。有什么想法吗？

编辑：听起来有点模糊，不是吗？

我有：

cell 1.1                     cell 1.2                               cell 1.3
cell 2.1                     cell 2.2                               cell 2.3
cell 3.1                     cell 3.2                               cell 3.3

我想：

cell 1.1                     cell 1.2                      
cell 1.3
cell 2.1                     cell 2.2                        
cell 2.3
cell 3.1                     cell 3.2                       
cell 3.3

Answer 1

表不起作用。 <tr>表示新行，<td>位于同一行。你永远不会（或者至少应该永远不会）<td>来自不同行的<tr>。

cell 1.1                     cell 1.2                      
cell 2.1
cell 3.1                     cell 3.2                        
cell 4.1
cell 5.1                     cell 5.2                       
cell 6.3

编辑：在某种不适合表格的情况下，你似乎因某种原因而忙于使用表格。我可以建议以下实现（未经测试，您应该了解我正在尝试做的基础知识）？

<style>
    .menu-item: {
        display: block;
    }
    .price: {
        float: right;
    }
    .description {
        clear: both;
    }
</style>

<h3>Spaghetti</h3>
<div class="menu-item">
    <strong>Food name</strong>
    <span class="price">10.00</span>
    <span class="description">A great dish</span>
</div>

<div class="menu-item">
    <strong>Food name</strong>
    <span class="price">10.00</span>
    <span class="description">A great dish</span>
</div>

<div class="menu-item">
    <strong>Food name</strong>
    <span class="price">10.00</span>
    <span class="description">A great dish</span>
</div>

Answer 2

尝试这个小提琴：

https://jsfiddle.net/r47bm836/

table tr, table tr td:nth-last-child(1) {
    display: block !important;
    clear: both;
}
table tr, table tr td {
    clear: both;
}

似乎对我有用。

我有同样的问题。

Answer 3

使用单个<tr>使单元格1.3,2.3和3.3成为新的<td colspan="2">。

最近在新线上？

3 个答案: