HTML – 最后一行在新线?

前端之家收集整理的这篇文章主要介绍了HTML – 最后一行在新线?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我为客户转换了一些表格数据:
<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

解决方法

表不是那样的. < TR>表示新行,< td>在同一排.你永远不会(或者至少应该永远不会)来自同一个< tr>的< td>在不同的路线上.
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>

猜你在找的HTML相关文章