表：最后一个孩子不工作答案

【问题标题】：table:last-child not working表：最后一个孩子不工作
【发布时间】：2011-08-13 06:15:46
【问题描述】：

我有这样的事情

<table>
  <tr>
    <td>First table</td>
  </tr>
</table>

<table>
  <tr>
    <td>Second table</td>
  </tr>
</table>

还有下面的 CSS

table {
  margin-bottom:40px;
}
table:last-child {
  margin-bottom:0px;
}

但第二个表格仍然应用了 margin-bottom。做什么？

【问题讨论】：

【解决方案1】：

@Quentin 是正确的，您的代码不会重现您描述的问题。

我猜是什么问题。

table:last-child 并不表示“父元素中的最后一个table”。

它实际上意味着“父元素中的最后一个元素如果它是table”。

例如，给定这个 HTML table:last-child 不会选择任何东西：

<div>
    <table>
        ..
    </table>

    <table>
        ..
    </table>

    <div>I'm the last child</div>
</div>

【讨论】：

感谢您解决这个问题！我的印象是 table:last-child 是 parent 中的最后一个元素。

没问题 - 这是一个相当普遍的误解。 @Hierow 的答案应该适合你，:last-of-type 和 :last-child 具有几乎相同的浏览器支持。

【解决方案2】：

您可以尝试使用table:last-of-type。

这两个选择器在 IE8 及更低版本中都不起作用

【讨论】：