没有嵌套的 CSS 最后一个 child ?

标签 css sass

在不嵌套的情况下添加 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;
}

USE CASE: I need to add padding to the last element of my page wrapper, regardless of whatever it may be. And I am using SCSS.

最佳答案

由于您的类(class)名称,您想要实现的目标有点不清楚,但这就是我认为您想要的。

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

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

关于没有嵌套的 CSS 最后一个 child ?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54384429/

相关文章:

html - 在 CSS 中设置边框的高度

css - LESS 中 CSS 选择器的转义语法

javascript - 如何制作多级上下文菜单?

css - Tailwind css purge 删除所有深色类

css - 如何让css不重复同一个类?

javascript - SCSS根据id添加动画

javascript - 带有溢出 :hidden 的 Div 中带有 Javascript 的可滚动内容

asp.net - 在 ASP.net 中运行 CSS 文件中的代码

css - Webpack 在 SCSS @import SCSS 上抛出错误

css - 在nodejs中包含外部css文件