Question

我尝试使用:not选择器来删除某个元素后面没有元素（.red）的边距。

HTML

<section class="image"></section>
<div class="red"></div>
<section class="image"></section>
<section class="image"></section>
<section class="image"></section>

CSS

.image {
  background: green;
  height: 100px;
  width: 100px;
  margin-bottom: 30px;
}

.image + div:not(.red) {
  margin-bottom: 0;
}

出于某种原因，底部边距没有被移除。我已在行动over here中设置了CodePen。

感谢任何帮助。提前谢谢！

Answer 1

尝试使用兄弟选择器。这是JSFiddle

<强> CSS ：

div.red ~ .image {
    margin-bottom: 0;
}

这将定位任何 .image 前面的 .image 。但是，不会选择 div.red 之前的 .image 。

Answer 2

    .image {
      background: green;
      height: 100px;
      width: 100px;
      margin-bottom: 30px;
    }

    .red .image { //this will select the section which are children of red class and have image class
      margin-bottom: 0;
    }

使用：not Selector删除边距

2 个答案: