html - CSS仅更改表格中的一行

Question

我需要更改表格中一行的宽度属性而不影响其下方其他行的宽度。可以吗？

Edit1：对不起，不完整的问题。怎么做以及使用哪个属性？

我试过使用：

1. nth-child 属性，但它会影响该列中的整行。
2. 通过为其分配一个类来将样式应用于该特定行，但这两种方法都不起作用。

我有一个 3x3 表，我想在其中更改第一行的宽度，而不更改第二行和第三行的宽度。如图所示：

标签： htmlcss

Answer 1

您可以使用colspan的属性td

尝试这个：

table,
th,
td {
  border: 1px solid #000;
}

table {
  border-collapse: collapse;
}

td {
  padding: 10px;
  /*added only for better style of example*/
}

<table>
  <tr>
    <td colspan="2" >colspan 2</td> <!--this is the corresponding column-->
    <td>normal column</td>
  </tr>
  <tr>
    <td>normal column</td>
    <td>normal column</td>
    <td>normal column</td>
  </tr>
  <tr>
    <td>normal column</td>
    <td>normal column</td>
    <td>normal column</td>
  </tr>
</table>

精确复制（无内容）：

table,th,td {
  border: 1px solid #000;
}
table {
  border-collapse: collapse;
}
td {
  padding: 40px;
}

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

参考：https ://www.w3schools.com/tags/att_td_colspan.asp

希望能帮助到你！