HTML表格的行是否可以拥有不同数量的单元格？

Question

或者说总单元格数量应该等于列数 * 行数吗？

一个表格在不同行上具有不同数量的单元格似乎可以通过W3验证。

- randomguy

Answer 1

这并不违反定义。但是，您应该使用colspan属性将列扩展到整行：

<table>
  <tr>
    <td>Row with</td>
    <td>2 cols</td>
  </tr>
  <tr>
    <td colspan="2">Row with only one col</td>
  </tr>
</table>

如果单元格周围有边框，这也会有所帮助。

您甚至可以拥有一个列扩展到两行的表：

<table>
  <tr>
    <td rowspan="2">First column in row 1 and row 2</td>
    <td>Second column in row 1</td>
  </tr>
  <tr>
    <td>second column in row 2</td>
  </tr>
</table>

- 2ndkauboy

Answer 2

您可以使用 colspan，但包括 colspan 值的总和必须相等，以便正确渲染表格。

<table>
  <tr>
     <td colspan="2">blah</td>
  </tr>
  <tr>
     <td>blah</td>
     <td>boo</td>
  </tr>
</table>

第一行只有一个单元格，但由于 colspan 的存在，它跨越了 2 个单元格；第二行有两个单元格，这是完全有效的。

- meder omuraliev

Answer 3

可以。 在 table > tr > td 中，td 包含内容。在这里引用了 Td： http://www.htmlcodetutorial.com/tables/_TD.html。在该参考中，您可以看到 TD 有两个属性： colspan 和 rowspan。通过使用这两个属性，表格可以在不同的行上具有不同数量的单元格。
演示：

<table border="1">
     <tr>
          <td>a</td>
          <td>b</td>
     </tr>
     <tr> 
          <td colspan="2">c</td>
     </tr>
</table>

并且

<table border="1">
     <tr>
          <td rowspan="2">a</td>
          <td>b</td>
     </tr>
     <tr> 
          <td>c</td>
     </tr>
</table>

- Bang Dao

Answer 4

是的，您可以制作一个HTML表格，并在某些行上省略<td>元素，但这被认为是不好的形式，因为您无法确定HTML渲染器（浏览器）将如何处理此情况。不同的浏览器可能会稍微以不同的方式呈现它。

建议使用colspan将两个或多个相邻单元格合并为一个来定义具有可变单元格数的表。这将使最右边的单元格与其正确的列对齐，并消除任何关于您希望HTML渲染器执行什么操作的歧义。

- dthorpe

Answer 5

您使用了：

<table>
<thead>
    <th>Column one</th>
    <th>Column two</th>
    <th>Column three</th>
</thead>
<tbody>
    <tr>
        <td rowspan="2">A large cell</td>
        <td>Another small cell0</td>
        <td>Another small cell0</td>
    </tr>
    <tr>
        <td>Another small cell1</td>
        <td>Another small cell1</td>
    </tr>
</tbody>

- binhhoang18