Css 隐藏除前两段以外的长文本

我有一个很长的文本，我需要隐藏除前两段以外的所有内容。 出于各种原因，我不想在这个网站上使用jquery。这只能通过css实现吗？ 我知道第N个孩子很可能会玩这个把戏，但我很难想出一个具体的规则

<div class="text">
<p>display</p>
<p>display</p>
<p>hide from this point</p>
<p>...</p>
</div>

展示

展示

躲开这一点

是的，这可以通过CSS完成

         div p:nth-child(3){ }
         div p:nth-child(4){ }
         div p:nth-child(5){ }

这就是你要找的吗？

使用

.text p{
显示：无；
}
.text p:n子级（-n+3）{
显示：块；
}

---

以上内容将隐藏第二段之后的任何段落。更多关于CSS第n个子项的信息。

此代码将为您提供所需的结果：

​div.text > p:nth-child(n+3){
    display:none;
}​

---

一种更兼容的方法是使用

+

或

~

选择器（分别是相邻和一般同级选择器，可以使用IE7+）：

如果确定只有段落，也可以使用

+

。如果在两段之间有一个列表、一个子标题、blockquote或其他内容，那么只有

~

与非p元素后面的段落匹配。
前两个段落前面没有两个段落，因此它与选择器规则不匹配，并且它们仍然显示。接下来的段落前面都有两段（至少），因此它们将被隐藏

---

edit:：nth-child（）是一个非常有效的答案，但它不适用于IE8。

您打算在某个事件后显示文本吗？甚至有必要将该文本放在那里吗？我猜解决方案取决于为什么文本需要保留在页面上，即使它不可见。

nth child

是明显的解决方案，但它仅在较新的浏览器（对于给定数量的“新”）中受支持，尽管如此，请看。@kopischke我知道这一点，但我查看了我的统计数据，我的大多数访问者都在使用chrome或firefox。一些IE9，唯一的问题是IE8。我必须为他们找到一个解决方法，或者使用jquery。谢谢。这将使第n个子项即使在较旧的IE浏览器中也能工作。我还没有测试过，但我正在发布它以供参考。缺点：这种类型的脚本会减慢已经是最慢浏览器的浏览器的速度，并且显然只有在执行JS时才能工作。但是，如果经过测试，它仍然满足（适合？）你的需求，那么它是有效的。我知道，但从统计数据来看，它只占我访问者的一小部分。真不敢相信他们中有9个还在使用IE6。无论如何，在最坏的情况下，他们会看一长段文字。

.text p ~ p ~ p {
    display: none;
}