检测上面的div在CSS中是否有边距?

检测上面的div在CSS中是否有边距?,css,Css,我目前有两个要素: .item-one { margin-bottom: 24px; } ..other-elements.. .item-two { margin-top: 48px; } 这些项目本身很好,但是,如果我删除它们之间的。其他元素..,这样它们就会一个接一个,那么我的总利润(视觉上)将为72像素 。其他元素..具有一致的24px,这是因为流,但我的应用程序是动态的,用户可以切换元素的位置 不幸的是,这是非常不受欢迎的,因为它会导致外观不好的空间 我想写一些像这样

我目前有两个要素:

.item-one {
    margin-bottom: 24px;
}
..other-elements..
.item-two {
    margin-top: 48px;
}
这些项目本身很好,但是,如果我删除它们之间的
。其他元素..
,这样它们就会一个接一个,那么我的总利润(视觉上)将为72像素

。其他元素..
具有一致的24px,这是因为流,但我的应用程序是动态的,用户可以切换元素的位置

不幸的是,这是非常不受欢迎的,因为它会导致外观不好的空间

我想写一些像这样的东西

.item-two [if-div-is-previous -> .item-one] {
    //this will set the margin to 0 only if preceded by .item-one
    margin-top: 0px;
}

简言之,我试图在24px页面上的所有元素之间保持一致的距离,即使与24px页边距不同的项目是一个接一个的。

页边距不是这样工作的。CSS具有垂直折叠边距。
.item-one + .item-two {  } //if .item-two is next to .item-one
你的利润率永远是24像素,而不是48像素。只要两个是相邻的并且在相同的格式化上下文中

编辑:根据您添加的信息,我了解您的问题是以下相邻元素可能有较大的边距。您可以使用下面的选择器重置它们

#one~*{
  margin-top: 24px !important;
  margin-bottom: 24px !important;
}

对不起,这根本不是我的问题所在,你能告诉我你是怎么理解的吗,这样我就可以解决了,也许吧?//我明白这是怎么回事,但我希望其中一个元素改变它们的边距,如果另一个元素在它们旁边。这不是你要求的,你说你想要“所有元素之间保持一致的距离”。这已经是自然发生的事情了。这个代码笔说明了这一点:刚刚看到你重新表述了你的问题,我已经编辑了我的初始答案。谢谢你的努力,但另一个人提供了“+”这个词,效果非常好。我不确定我的解释哪里出错了。很明显,“其他元素”在其中起了作用,如果不知道那里发生了什么,就没有办法提供帮助。@Rob the“+”起作用了。第1项+第2项{}允许我查看这些项是否相邻,如果为true,则更改它们的属性:)这将仅适用于直接相邻的元素。如果有更多相邻元素,则不会影响它们。正确。这正是我想要的!此外,我发现只使用边距顶部然后填充底部来生成空格通常会产生更好的结果,而且我不必编写那么多规则(因此不会有太多的布局破坏)。@Adren您知道如何添加第三个参数,例如.item one+.item two |这里还有一个item |?那么,如果项目1后面跟着项目2,那么会对下一个选择器进行更改吗?