如何仅将 css 应用于顶级元素答案

【问题标题】：How to apply css to top level element only如何仅将 css 应用于顶级元素
【发布时间】：2013-02-10 04:52:57
【问题描述】：

在我的 HTML 中，我在单独的部分中有一些页脚元素，然后是页面的一个全局页脚元素。我只想让全局页脚出现在视口的底部。

如果我这样做，它将影响所有页脚：

footer {
    position: fixed;
    bottom: 0px;    
}

如果我这样做，它会按预期工作，但 body 语法看起来不正确：

body > footer {
    position: fixed;
    bottom: 0px;    
}

有没有更好的方法只指定顶级页脚？

【问题讨论】：

【解决方案1】：

将一个类添加到您的页脚并将您的 CSS 应用到该特定类。正如其他人指出的那样，body > footer 并没有错。

【讨论】：

【解决方案2】：

向全局页脚添加一个类是最简单的解决方法，或者您可以这样做：

body > footer:last-child

【讨论】：

是的，上课可以。 last-child 在我的情况下不起作用，因为节页脚是其节元素的最后一个孩子，因此它们也会受到影响。
这仅在footer 确实是body 中的最后一个子元素并且它不是出现footer 的其他元素中的最后一个子元素时才有效。所以这对于 OP 仍然无法正常工作。
对于编辑：假设只有一个 footerwithin body 并且最后一个 body > footer 与 body > footer:last-child 相同，只是更短。