css - 仅使用 CSS：在整个文档中选择第一次出现的类

Question

我们有一个这样的 DOM：

<div class="outer">
    <div class="inner"> <!--// No "copyright" in this node //-->
        <div class="content">...</div>
    </div>
    <div class="inner">
        <div class="content">...</div>
        <div class="copyright">...</div> <!--// DISPLAY THIS ONE //-->
    </div>
    <div class="inner">
        <div class="content">...</div>
        <div class="content">...</div>
        <div class="content">...</div>
        <div class="copyright">...</div> <!--// Hide this one //-->
    </div>
    <div class="inner">
        <div class="content">...</div>
        <div class="content">...</div>
        <div class="copyright">...</div> <!--// Hide this one too, etc. //-->
    </div>
    <!--// etc. //-->
</div>

必须隐藏所有具有“版权”类的元素，但第一个元素除外。

我们试图应用这种方法，但不幸的是没有成功。它必须是唯一的 CSS 解决方案。任何想法？

谢谢你的帮助！

Answer 1

在这种情况下， each.copyright是 中的第一个也是唯一一个.inner，因此您需要改为 select by .inner。如果您不需要对第一个孩子应用任何特殊规则，则不需要使用我在另一个问题中描述的方法；只需使用它来隐藏其他元素：

.inner ~ .inner .copyright {
    display: none;
}

Answer 2

试试这个JSfiddle

div.inner > .copyright { display:none; }
div.inner:first-child .copyright { display:block; background:#000; }

​</p>