Question

添加 class =“ very-last-child” 而不嵌套时，我需要选择所有对象的最后一个子代。

例如，在这里，我需要选择最后一个div。没事没事。

<body>
 <div class="very-last-child">
  <p>The first paragraph.</p>
  <p>The second paragraph.</p>
  <p>The third paragraph.</p>
  <p>The fourth paragraph.</p>
  <div class="select-me">
   <p>The first paragraph.</p>
   <p>The second paragraph.</p>
   <p>The third paragraph.</p>
   <p>The fourth paragraph.</p>
  </div>
 </div>
</body>

我确实在这些线路上尝试了一些方法，但是没有用。

div > :last-of-type {
  padding-bottom: 50px;
}

p, div{
border: 2px solid black;
}

使用案例：无论页面大小如何，我都需要在页面包装的最后一个元素中添加填充。我正在使用 SCSS 。

Answer 1

由于类名的原因，您不清楚要达到的目标，但这就是我认为您想要的。

.very-last-child > :last-child {
    padding-bottom: 50px;
}

这在类select-me的底部提供了50px的填充

Answer 2

要仅选择容器的最后一个子代，可以使用：

<selector> > :last-child {
    ...
}

就您而言，

body > :last-child {
    ...
}

CSS没有嵌套的最后一个子代？

2 个答案: