3

我正在尝试使用以下方法隐藏具有类名的最后 3 个.latest-itemdiv 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-childlast-child而不是:http: //jsfiddle.net/nMbm5/1/

于 2012-09-05T00:06:05.333 回答
0

听起来这是目前 CSS 的一个缺点。改用javascript:

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