：在节后添加页脚时的最后一个子问题

Question

是的，所以这很奇怪。此代码按预期工作：

HTML：

<section>
    Section #1
</section>

<section>
    Section #2
</section>

<section>
    Section #3
</section>

CSS：

section{
    margin-right: 30px;
}
section:last-child{
    margin-right: 0;
}

前两个部分获得30px的右边距，而第三部分没有获得正确的边距。

现在，如果我在最后一节之后添加一个页脚元素，则会忽略：last-child。这样，所有三个部分都将具有30px的右边距。这在Mozilla和Webkit中都适用。

有没有人知道为什么会这样，以及如何修复它？

Answer 1

:last-child表示最后一个孩子，它与选择器的其余部分无关，它是一个独立的限制。这意味着它必须是最后一个孩子，无论元素类型或类等等......它实际上是最后一个子元素。由于您的页脚位于此之后，因此没有匹配的元素 一个<section> 和一个:last-child。

这个选择器是:last-of-type，但它没有得到广泛支持。