Question

我需要在动态添加tbody中的内容的表中更改最后一个tr的第一个td的宽度。

我的代码：

<table id="items">
<tr>
<th>SL.No.</th>
<th>Description</th>
<th>Qty</th>
<th>Price</th>
<th>Total</th>
</tr>
</thead>
<tbody>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>

我需要将列slno设置为50px，我的意思是所有三行的第一个td的宽度，我还需要将最后一行的第一个td的宽度设置为500 px。我怎么能这样做？

我确实喜欢这个：

#items tbody tr:last-child td:first-child {
width:500px;
}

但它不起作用。

请帮忙。

Answer 1

如果您想要宽度超过其他单元格的单元格，请使用colspan。

此处提供了一个示例：http://www.w3schools.com/tags/att_td_colspan.asp

<强> HTML

<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$100</td>
  </tr>
  <tr>
    <td colspan="2">Sum: $180</td>
  </tr>
</table>

Answer 2

这个应该适合你的问题。

tr:last-child>td:first-child {
width:500px;

}

Answer 3

试试这个：

<强> CSS

#items tr:last-child td:first-child{
    width:500px;
}

#items tr td:first-child{
    width:50px;
}

fiddle

如何将CSS应用于最后一个tr的第一个td

3 个答案: