纯CSS中的第一个和最后一个类选择器

Question

我只需要使用纯CSS选择整个文档中的第一个和最后一个类 在我的情况下，结构如下：

<div class="Container">
    <div>
        <div class="Parent"></div>
        <pre>
            <span>
                <span class="myClass">YES</span>
                <span class="myClass">NO</span>
                <span class="myClass">NO</span>
            </span>
        </pre>
    </div>
    <div>
        <div class="Parent"></div>
        <pre>
            <span>
                <span class="myClass">NO</span>
                <span class="myClass">NO</span>
                <span class="myClass">YES</span>
            </span>
        </pre>
    </div>
</div>

DEMO HERE

注意：的 我试图在真正的codemirror匹配标签上应用它，我不确定我发布的结构是否正确.. Here the real codemirror matchtags demo

Answer 1

看起来这就是你所需要的：

.CodeMirror-code > div:first-child  .cm-tag:first-child {
    border: 1px solid red;
}
.CodeMirror-code > div:last-child .cm-tag:last-child {
    border: 1px solid blue;
}

<强> UPDATED FIDDLE

注意：此解决方案依赖于所有span元素都包含公共类cm-tag的假设 - 正如OP的小提琴所示。