：nth-last-child（-n + 3）不適用於文章元素？

-1

，因爲它說，我想知道爲什麼:nth-last-child(-n+3) {}我的文檔標記裏面的物品元素是不工作的稱號？根據評論它應該工作，如下面的例子：http://jsfiddle.net/8PXXm/

當我通過我的佈局內的標記，它不適合我。我想選擇連續的最後3個項目。

.post-entry:nth-last-child(n+3) { display: none; }

上面代碼中選擇所有的行項目，而不是最後3

HTML：

<article class="grid_4 post-entry"> 
    <a href="#" title=""> 
     <figure class="post-thumb"> 
       <img src="../images/placehold.png" alt="Placehold"> 

       <figcaption> 
        <img src="../images/cross.png" alt="Cross x"> 
       </figcaption><!-- End figcaption.post-thumb --> 
     </figure><!-- End figure.post-thumb --> 
    </a> 
</article><!-- End article.grid_4 post-entry -->

的jsfiddle：http://jsfiddle.net/4XP5W/11/

希望你能幫助我。謝謝！

來源

2014-04-28 Caspert

什麼是您的HTML看起來像兄弟姐妹？ –

'是否：nth-last-child（-n + 3）與article元素一起工作？' - 是的（參見[** jsfiddle **]（http://jsfiddle.net/8PXXm/））。正如你可以在[** w3org Spec on nnth-last-child **]（http://www.w3.org/TR/css3-selectors/#nth-last-child-pseudo）中看到的那樣，它沒有提到「article」元素被排除在功能之外。您的問題很可能是CSS命令本身與您擁有的標記結合使用。如果您發佈相關標記，我們可以看看。 – Nope

你的代碼很好，你只是在選擇器中缺少-。

但它仍然無法正常工作？

你需要最後兩個元素div.clear和footer.grid_12從你的父母刪除div.container12

因爲：

的：第n-最後孩子CSS僞類，它有一個+ B-的元素相匹配1個兄弟姐妹放在文檔樹中。

所以，你的選擇是.post-entry:nth-last-child(n+3) { background: red; }選擇

div.clear和footer.grid_12兄弟姐妹。

編輯：

如果你想保持你的HTML文檔中的這些元素，只是包裝你的.post-entry元素的任何塊元素內的類似div，section排除.post-entry最後兩個非兄弟姐妹。因此，請確保該塊元素只包含.post-entry

JSFiddle

來源

2014-04-29 12:11:39

奧克。我看到了。當我刪除上面的代碼時，它將正確應用於文章元素的最後3個元素。但是這兩個div對我的標記都很重要。有沒有可能解決這個問題？ @RahilWazir – Caspert

@Caspert查看更新後的答案和小提琴。 –

謝謝。它正在工作！ – Caspert

：nth-​​last-child（-n + 3）不適用於文章元素？

回答

相關問題

：nth-last-child（-n + 3）不適用於文章元素？