3

.latest-itemを使用して、クラス名で最後の3つのdivを非表示にしようとしていnth-childます。

<div class="latest-group">

            <div class="latest-1 latest-item latest-sort-1">
              <h3>Title</h3>
              <p>Paragraph</p>
            </div><!--end latest-1-->

            <div class="latest-2 latest-item latest-sort-2">
              <h3>Title</h3>
              <p>Paragraph</p>
            </div><!--end latest-2-->

            <div class="latest-3 latest-item latest-sort-3">
              <h3>Title</h3>
              <p>Paragraph</p>
            </div><!--end latest-3-->

          </div><!--end latest-group-->

          <div class="latest-group">

            <div class="latest-4 latest-item latest-sort-1">
              <h3>Title</h3>
              <p>Paragraph</p>
            </div><!--end latest-4-->

            <div class="latest-5 latest-item latest-sort-2">
              <h3>Title</h3>
              <p>Paragraph</p>
            </div><!--end latest-5-->

            <div class="latest-6 latest-item latest-sort-3">
              <h3>Title</h3>
              <p>Paragraph</p>
            </div><!--end latest-6-->

          </div><!--end latest-group-->​

およびCSS：

.latest-item:nth-child(n+3) { 
           display:none;
       }​

クラス名のdivを正しくターゲットにできません.latest-item。jQueryでは、次のようなことができます。

$（ "。latest-item"）。slice（3）.hide（）;

これがフィドルです：

http://jsfiddle.net/nMbm5/

4

2 に答える 2

2

代わりに使用する必要があるnth-last-childと思います：http： //jsfiddle.net/nMbm5/1/last-child

于 2012-09-05T00:06:05.333 に答える
0

このように聞こえますが、現時点ではCSSの欠点です。代わりにjavascriptを使用する：

$(".latest-item").slice(3).hide();
于 2012-09-05T19:08:58.267 に答える