html - CSS嵌套组合器

Question

假设我在某处有以下代码:

<div>
    <h1></h1>
</div>
<a></a>

以及其他地方的附加代码:

<div>
    <h1 class="specialClass"></h1>
</div>
<a></a>

我想编写只选择第二个 anchor 标记的 CSS。这可行吗？我最初的猜测是做一个如下所示的选择器:

div > h1.specialClass ~ a

但这行不通。我如何嵌套组合器以在当前的 css 中获得它/甚至可能？

Answer 1

如果两个标签都是同一父标签的子标签，那么您可以使用 the :nth-of-type() selector :

a:nth-of-type(2) {
    background: red;
}