css 管理边距,使最后一个元素没有边距

b4qexyjb  于 2023-01-27  发布在  其他
关注(0)|答案(4)|浏览(399)

我处理方框,我希望总是给最后一个元素一个"margin-bottom":所以首先我给每个元素一个"margin-bottom:1em;"。我现在想删除我的框中最后一个元素的底部边距,但如果其中有一个元素,它就不起作用,并且我在底部仍然有一个边距。知道如何做到这一点吗?它可以是一个段落或DIV或SPAN或任何东西,所以我并不总是想手工完成这一点。我想用它做一个混合。
我试过:

section *+:last-child {
   margin-bottom: 0;
   border: 3px solid blue;
}

但是在最后一个div中有一个带有边距的段落,所以它不起作用。

iovurdzv

iovurdzv1#

您需要使用:not()。也就是说,
section:not(:last-child) { margin-bottom:1em; }
我的语法可能不适合你所做的事情,但这是一个开始。

lstz6jyr

lstz6jyr2#

我个人会使用类名,并且专门针对我想要修改的类。

Syntax:
:last-child

Usage:
p:last-child {
  font-size: 0.75em;
}

更多信息here

6l7fqoea

6l7fqoea3#

section div:last-of-type p {
  margin-bottom: 0;
  border: 3px solid blue;
 }

看起来排序了......但是,这假设最后一个元素是div中的一个段落。如果你有不同的最后一个元素,一个类将是一个更有效的解决方案。

ghg1uchk

ghg1uchk4#

我自己也在为同样的问题尝试一些东西,以下是我所做的:

p:not(:first-child) {
   margin-top: 10px;
}

如果你想触发一个特定元素中的每个元素(对我来说,它是一个名为". hs_cos_wrapper_type_rich_text"-HubSpot的类),那么你可以这样做:

.hs_cos_wrapper_type_rich_text > *:not(:first-child) {
   margin-top: 10px;
}

这样,最后一个元素没有下边距,第一个元素没有上边距,中间的每个元素都有上边距。
干杯!

相关问题