Question

通常情况下，CSS是我的事，但我不知道为什么这对我不起作用。我正在通过货物构建一个用于CMS目的的网站，您可以在此处查看：http://cargocollective.com/mikeballard

在我的菜单中，我有五个主要类别，点击它们（例如图像）会显示该类别下的工作列表。

<div id="menu_2444167" class="link_link">
    <a id="p2444167" name="mikeballard" target="" href="http://cargocollective.com/mikeballard/filter/images">Images</a>
</div>
<div id="menu_2444188" class="project_link">
    <a name="mikeballard" rel="history" href="mikeballard/#2444188/Ultra-Nomadic-Def-Smith-Cycle-2011">Ultra Nomadic Def Smith Cycle, 2011</a>
</div>
<!-- more divs here -->
<div id="menu_2444201" class="project_link">
    <a name="mikeballard" rel="history" href="mikeballard/#2444201/Archive">Archive</a>
</div>

基本上，我正在尝试选择此集合中的最后一个div，并为该div添加一个margin-bottom：15px。我尝试过使用：

.project_link:last-child或.project_link:last-of-type但似乎没有效果。

对于依赖Cargo而言不能改变太多的HTML并不是很好，就好像他们使用了列表项，而不是使用锚标签的div我假设这会更容易。

Answer 1

IE9之前不支持:last-of-type和:last-child选择器。

对于:last-child和:last-of-type选择器，未查看等类名称等。如果特定元素是父元素中的最后一个子并且具有类“project_link”，则.project_link:last-child选择器将仅触发<{1}}如果特定元素是该类型的最后一个元素并且具有类“project_link”，则选择器将仅触发。

两者都应该在支持浏览器中触发，因为它隐含为.project_link:last-of-type并且将检查该父级内的每种类型的元素（看起来只是分裂）。此处显示的最后一个分区具有与此规则匹配的类“project_link”。这些不会触发的唯一原因是，如果您有更多的元素（或部门）低于您向我们展示的内容，或者您正在使用不支持它的浏览器。

添加：last-child或：last-of-type到nav菜单

1 个答案: