Html 将css添加到最后一个元素

我有基于引导的菜单，我想添加css到最后的下拉菜单。所以我有html：

<div class="collapse navbar-collapse" >
    <ul class="nav navbar-nav ">
        <li class="drop">
            <a href="1.html">Lorem</a>
            <ul class="dropdown">
                <li><a href="#">Lorem</a></li>
            </ul>
        </li>
        <li class="drop">
            <a href="1.html">Lorem</a>
            <ul class="dropdown">
                <li><a href="#">Lorem</a></li>
            </ul>
        </li>
    </ul>
</div>

---

但是这段代码将css添加到所有下拉子菜单中，但我只想要last

这里的问题是，

类型的last

正在查找最后一个同级，但您的两个

。下拉列表

不是同级-它们是

.drop

元素的子元素

如果您改为这样做：

.navbar-nav li.drop:last-of-type ul.dropdown{
    left:-140px;
}

---

。。。然后它应该会像您期望的那样工作。

这里的问题是

类型的最后一个
正在寻找最后一个同级，但是您的两个
。下拉列表
不是同级-它们是
元素的子元素

如果您改为这样做：

.navbar-nav li.drop:last-of-type ul.dropdown{
    left:-140px;
}

。。。然后它应该像您期望的那样工作。
.navbar nav li.下拉：ul类型的最后一个。下拉：类型的最后一个
应该是它
。navbar nav li.下拉：ul类型的最后一个。下拉：类型的最后一个
应该是它