CSS3获取最后一个元素

Question

我如何从以下代码中获取最后一个元素(hr):

<div>
    <div>
        <span class="hr"></span>
    </div>

    <div>
        <span class="hr"></span>
    </div>

    <div>
        <span class="hr"></span> <!-- I need this -->
    </div>
</div>

.hr:last-child 不起作用.

当然,DOM结构可能更复杂.我只需要获取最后需要的元素.

Answer 1

你的问题不太清楚; 有几种方法可以.hr从您的示例中获取最后一个元素,但您说"DOM结构可能更复杂".为了回答你的问题,你需要提一下你可能拥有的DOM结构; 在某些情况下它可能是有可能的,有些则不可能.

这是一种.hr摆脱最后的方法div:

div div:last-of-type .hr

这是另一种让.hr外面的孩子离开的方法div:

div :last-child .hr

如果您需要.hr从文档中获取最后一个元素,无论它是什么内容,那么您无法在CSS中执行此操作.在CSS中,您只能在层次结构的某个特定级别选择第一个,最后一个或第n个元素,无论嵌套的是什么,都无法选择某个类型的最后一个元素.

Answer 2

div:last-child .hr