CSS - 第一个没有特定类别的孩子

是否可以编写一个 CSS 规则来选择没有特定类的元素的第一个子元素？

example:

<div>
    <span class="common-class ignore"></span>
    <span class="common-class ignore"></span>
    <span class="common-class"></span>
    <span class="common-class"></span>
</div>

在这种情况下我想选择第一个span没有课ignore。 我尝试了这个，但似乎不起作用：

.common-class:first-child:not(.ignore) {
    ...some rules...
}

UPDATE:

如果我向名为的父 div 添加一个类parent-class，Jukka 建议的选择器的修改版本可以工作，除非第一个span与类ignore在第一个没有之后出现。上述选择器如下：

.parent-class > .common-class.ignore + .common-class:not(.ignore) {
    ...some rules...
}

这个问题类似于第一个带有类的元素的 CSS 选择器 https://stackoverflow.com/questions/2717480/css-selector-for-first-element-with-class，除了第一个元素without一类。如上所述，:first-child:not(.ignore)表示一个元素，该元素是其父元素的第一个子元素，并且不具有“ignore”类，而不是与选择器的其余部分匹配的第一个子元素。

您可以将重写技术与我在中描述的同级组合器一起使用我的答案 https://stackoverflow.com/questions/2717480/css-selector-for-first-element-with-class/8539107#8539107对于链接的问题，将类选择器替换为:not()包含类选择器的伪类：

.common-class:not(.ignore) {
    /* Every span without class .ignore, including the first */
}

.common-class:not(.ignore) ~ .common-class:not(.ignore) {
    /* Revert above declarations for every such element after the first */
}