我想改变一个div的子元素的背景颜色，并且想知道是否可以用CSS来实现。我将在下面解释这个例子。
类似于：

.container[background-color=some color] .content {
    background-color: some other color
}

我的猜测是，这是不可能做到的，因为这样你就可以做一些事情了：

.div {
    background-color: some color
}

.div[background-color=some color] {
    background-color: some other color
}

这将创建某种循环，其中div将被选择，设置为其他颜色，然后不再被选择，并返回到原始定义，但随后再次被选择，因为它具有原始颜色。
我不认为：has、：is和：where选择器也是这样工作的，但我希望有某种方法可以做到这一点，同时避免在Javascript中这样做。

案例

div是根据用户输入中的错误动态创建的。这些div可能包含也可能不包含需要另一个div来处理的特定类型的错误

// simple errors
<div class="errors">
    <p>Error 1</p>
    <p>Error 2</p>
    <p>Error 3</p>
    <p>Error 4</p>
</div>

// more complex errors
<div class="errors">
    <p>Error 1</p>
    <div class="complex-error">
        <p>Complex Error 1</p>
    </div>
</div>

我给予errors div一个奇数/偶数的背景色

.errors {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    border-radius: 4px;
    margin: 8px 0px;
}

.errors:nth-child(odd) {
    background-color: #dee2e6;
}

.errors:nth-child(even) {
    background-color: #f8f9fa;
    border: 2px solid #dee2e6;
}

我想知道errors类的元素是否可以根据背景颜色选择，然后选择它的子元素。
我会发布我自己的解决方案作为答案。