如何選擇元素中的最後一個元素，而不管CSS中的類型是什麼？

Question

我想選擇最後一個嵌套元素，而不管元素的類型如何。

例子：

<section> 
    <div></div> 
    <p></p> 
    <div></div> <-- I want this element 
</section> 
<section> 
    <div></div> 
    <p></p> 
    <a></a>  <-- I want this element 
</section> 
<section> 
    <div></div> 
    <p></p> 
    <ul>  <-- I want this element 
     <li></li> 
    </ul> 
</section> 

我如何獲得這些元素？ :last-child似乎沒有辦法，:last-of.type也沒有幫助，因爲我必須指定我想要的元素類型。

我想要section元素的最後一個嵌套元素。

Answer 1

使用此：

section > *:last-child { 
    // your custom css styles 
} 

說明：

這工作，因爲當你使用：

>它選擇直接孩子

*這個選擇所有元素

nth-child確保所有的直接子女都將成爲目標（如果您使用nth-of-type則不是這種情況。

Answer 2

可以使用section >*:last-child，其中*是通用選擇和>爲孩子選擇，只意味着將適用於section

section { 
 
    color: blue 
 
} 
 
section > *:last-child { 
 
    color: red 
 
}

<section> 
 
    <div>blue</div> 
 
    <p>blue</p> 
 
    <div>red</div> 
 
    <!-- I want this element --> 
 

 
</section> 
 
<section> 
 
    <div>blue</div> 
 
    <p>blue</p> 
 
    <a>red</a> 
 
    <!-- I want this element --> 
 

 
</section> 
 
<section> 
 
    <div>blue</div> 
 
    <p>blue</p> 
 
    <ul> 
 
    <!-- I want this element --> 
 

 
    <li>red</li> 
 
    </ul> 
 
</section>