2

我在使用 CSS:first-child和:last-child.

我需要在第一个标签之间添加一些空格，<a>我只需要 margin-bottom:5px 和最后一个标签 0px。

这是我的代码..我在这里做错了什么？还有其他选择吗？谢谢

.addthis_toolbox.atfixed
    {
        border: 1px solid #eee;
        padding: 5px;
        width: 32px;
    }
    .addthis_toolbox:first-child
    {
        margin-bottom:5px;
    }
    .addthis_toolbox:last-child
    {
     margin-bottom:0px;
    }

<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_32x32_style atfixed">
    <a class="addthis_button_preferred_1"></a>
    <a class="addthis_button_preferred_2"></a>
    <a class="addthis_button_preferred_3"></a>
    <a class="addthis_button_preferred_4"></a>
    <a class="addthis_button_compact"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e55018a5d405a71"></script>
<!-- AddThis Button END -->
4

2 回答 2

4

您需要在.addthis_toolbox和:first-child/之间添加一个空格:last-child

否则，它只会选择.addthis_toolbox作为其父母的第一个或最后一个孩子的元素。

:first-child应用于元素，仅选择元素是first-child其父元素的元素。

您可以在w3c 规范中阅读有关伪选择器如何工作的更多信息。

于 2011-08-24T16:28:41.030 回答
3

直接修复您提供的内容，您需要：

.addthis_toolbox a:first-child
{
    margin-bottom:5px;
}
.addthis_toolbox a:last-child
{
 margin-bottom:0px;
}

问题.addthis_toolbox:first-child在于它选择了一个.addthis_toolbox是其父级的第一个子级。这不是你想要的。

我可能会在这里感到困惑，但是如果您想在every a之间添加一个间隙，请使用它来处理它：

.addthis_toolbox a + a {
    margin-top: 5px;
}

由于不使用:last-child.

于 2011-08-24T16:28:47.327 回答