Question

我有3个主要元素：.submit-it，.send-it，.get-results。

如果他们拥有类:after或excluded，我希望他们的所有error元素都具有某些样式。我认为这会奏效，但事实并非如此。

.submit-it, .send-it, .get-results {
  &:not(.excluded), &:not(.error) {
    &:after {
      content: 'text';
    }
  }
}

Answer 1

通过生成以下选择器，您基本上可以设置所有:after伪元素的样式，无论其类如何。

.submit-it:not(.excluded):after,
.submit-it:not(.error):after, { ... }

选择没有课程excluded的所有元素，以及没有课程error的所有元素，您间接选择所有元素，因为这两个元素事件不是相互排斥的。

因此，您将链接:not()伪类，并替换：

&:not(.excluded), &:not(.error)

使用：

&:not(.excluded):not(.error)

.submit-it, .send-it, .get-results {
  &:not(.excluded):not(.error) {
    &:after {
      content: 'text';
    }
  }
}

将输出：

.submit-it:not(.excluded):not(.error):after,
.send-it:not(.excluded):not(.error):after,
.get-results:not(.excluded):not(.error):after {
  content: 'text';
}

LESS CSS选择器组合not和：after伪元素

1 个答案: