非常に長いテキストがあり、最初の2つの段落以外のすべてを非表示にする必要があります。 さまざまな理由から、私はこのサイトではjqueryを使用しないでください。これはCSSでのみ行うことができますか？ 私はnth-childがこのトリックを行う可能性が高いことを知っていますが、私は特定のルールを思いつくのに苦労しています。最初の2つの段落以外の長いテキストを非表示
<div class="text">
<p>display</p>
<p>display</p>
<p>hide from this point</p>
<p>...</p>
</div>
このコードはあなたに、所望の結果を与える：
div.text > p:nth-child(n+3){
display:none;
}
はい、これはCSS
div p:nth-child(3){ }
div p:nth-child(4){ }
div p:nth-child(5){ }
で行うことができますが、あなたが探しているものを、このですか？
使用
.text p {
display:none;
}
.text p:nth-child(-n+3) {
display:block;
}
上述した第2の後に任意の段落を非表示になります。 CSS nth-child hereの詳細
（IE7 +とOK RESP隣接および一般兄弟セレクタ、。）+又は~セレクタ使用される、より互換性のある方法：
.text p ~ p ~ p {
display: none;
}
の場合は、段落だけがあるので、+も使用できます。あなたがリスト、副見出し、引用符、または2段落の間のものを持っているなら、~だけがその非p要素に続く段落と一致します。
最初の2つの段落の前に2つの段落がないため、セレクタルールと一致せず、引き続き表示されます。次のものはすべて2つの段落（少なくとも）で囲まれているので、隠されます。
編集：：nth-child（）は完全に有効な答えですが、IE8では動作しません。
ありがとうございます。これは古いIEのブラウザでもnth-childを動作させるはずです。まだテストしていませんが、私は参考のために投稿しています。 http://selectivizr.com/ http://caniuse.com/#search=nth-child – Barbara
欠点：このタイプのスクリプトは、すでに最も遅いブラウザーであるブラウザーを遅くし、JSが実行された場合にのみ機能します。しかし、テストの後、それでもあなたのニーズを満たしていれば、うまくいきます。 – FelipeAls
私は知っていますが、統計を見ると、それは私の訪問者のほんの一部です。彼らのうち9人がまだIE6を使っているとは信じられません。とにかく、テキストの長い段落を見る最悪のシナリオです。 – Barbara
イベントの後にテキストを表示しますか？そのテキストが存在することさえ必要ですか？私は、テキストが表示されないにも関わらず、そのテキストをページに残す必要がある理由によって解決策が変わると思う。 – biggles
'nth-child'は明白な解決策ですが、それは新しいブラウザでのみサポートされています（http://caniuse.com/#search=nth-child参照）。 – kopischke
@kopischke私はそれを知っていますが、私は私の統計を見て、私の訪問者のほとんどはクロームやFirefoxを使用しています。いくつかのIE9、唯一の問題はIE8のものです。私はそれらの回避策を見つけるかjqueryを使用する必要があります。おかげさまで – Barbara