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>

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

我们尝试应用此approach，但遗憾的是没有成功。它必须是仅CSS的解决方案。有什么想法吗？

感谢您的帮助！

Answer 1

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

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

Answer 2

试试这个JSfiddle

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

仅限CSS：在整个文档中选择第一次出现的类

2 个答案: