[英]CSS: last-child of parent
:last-child
works great when all of the "children" elements are the same (ie: all <p>
's or all <li>
's and the rule is applied to that type of child. :last-child
当所有“children”元素相同时(即:所有<p>
或所有<li>
)并且该规则适用于该类型的子元素时, :last-child
工作得很好。
But how can I use CSS to select the last "child" element inside a parent which contains varying elements? 但是,我如何使用CSS来选择包含不同元素的父级中的最后一个“子”元素?
For instance, in this example, how could I apply a rule to the .parent
to select the last object inside of it (the div
)? 例如,在这个例子中,我如何将规则应用于.parent
以选择其中的最后一个对象( div
)?
.parent:last-child { background-color: red; }
<div class="parent"> <p>First child</p> <input type="text" placeholder="Second child" /> <div>Third child</div> </div>
You can use .parent > *:last-child
or just .parent > :last-child
你可以使用.parent > *:last-child
或只是.parent > :last-child
An asterisk (*) is the universal selector for CSS. 星号(*)是CSS的通用选择器。 It matches a single element of any type. 它匹配任何类型的单个元素。 Omitting the asterisk with simple selectors has the same effect. 用简单的选择器省略星号具有相同的效果。
.parent > *:last-child { background-color: red; }
<div class="parent"> <p>First child</p> <input type="text" placeholder="Second child" /> <div>Third child</div> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.