CSS:复杂选择器 :parent 和 :not

Question

我有这个 html 代码:

<div class='ui'>
    <h3 class='title'>
        <a href='#'>Link to Header</a>
    </h3>
</div>
<a href='#'>Another link</a>

我想为所有 anchor a 设置 CSS 样式，但不是为 div.ui 的父级 h3 元素中的 anchor 。我无法将类添加到 anchor a 到 h3 元素中。

我试试这个:

a:not(:parent:parent.ui){color:#dedede;}

但这不起作用。有什么解决办法吗？

Answer 1

正如 Kobi 在评论中指出的那样，没有这样的 :parent 选择器。

我建议您设置所有 a 标记的样式，然后在 h3 标记中使用不同的规则设置 a 标记:

a { 
    color: #dedede;
}
.ui h3 a {
    color: another color;
}