css td 几行合一行

CSS中可以使用属性选择器（colspan 和 rowspan）来控制<td>元素在表格中合并几行或几列。

/* 合并两个单元格 */
td {
  border: 1px solid #ccc;
}
td[colspan="2"] {
  background-color: #fefefe;
}

<table>
  <tr>
    <td>单元格1</td>
    <td colspan="2">单元格2和单元格3合并</td>
  </tr>
  <tr>
    <td>单元格4</td>
    <td>单元格5</td>
    <td>单元格6</td>
  </tr>
</table>

上述代码中通过设置colspan="2"来让<td>元素跨越了2列，从而实现了合并单元格的效果。同样地，也可以使用rowspan属性来控制<td>元素在表格中合并几行。

/* 合并两个单元格 */
td {
  border: 1px solid #ccc;
}
td[rowspan="2"] {
  background-color: #fefefe;
}

<table>
  <tr>
    <td>单元格1</td>
    <td>单元格2</td>
    <td>单元格3</td>
  </tr>
  <tr>
    <td rowspan="2">单元格4和单元格7合并</td>
    <td>单元格5</td>
    <td>单元格6</td>
  </tr>
  <tr>
    <td>单元格8</td>
    <td>单元格9</td>
  </tr>
</table>

同样，上述代码中通过设置rowspan="2"来让<td>元素跨越了2行，从而实现了合并单元格的效果。