JSFIddle:http://jsfiddle.net/s3fnhmtz/3/
很常见margin-bottom: 20px在像 <p> 这样的元素上或 .button因为我们倾向于在页面流中使用它们，而这些需要喘息的空间。
但我经常遇到的问题是删除这个边距，如果它是 <div class="panel"></div> 之类的最后一个元素。有一些填充我们得到 20px + margin在底部，所以我们最终在底部得到比顶部更大的空间。
我通常使用的 1 个修复是:.panel *:last-child *:last-child {尽管这很糟糕，但它在大多数情况下都有效。但是在 fiddle 中你可以看到你是否使用了类似 <dt> 的东西。它有点崩溃。
我无法现实地遍历并列出所有可能放在最后的元素，所以有没有更好的万无一失的方法来解决这个问题？
最佳答案
虽然仍然有效，但很多答案都没有捕获问题的重点，这是递归向下钻取最后一个 child 的更简洁的方法。
请在此处查看此答案:Select recursive :last-child. Possible?
因此，您唯一的办法可能是使用通配符选择器进行深入研究。
.panel.two > *:last-child,
.panel.two > *:last-child > *:last-child,
.panel.two > *:last-child > *:last-child > *:last-child {
margin-bottom: 0;
}
您可以使用 SASS 创建递归检查混合，但我不相信优雅的单属性递归应用程序存在。 :(
关于html - CSS :last-child selector in nested elements 的最佳用法，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31457798/