css - CSS 选择器和标签组合

Question

我有一个序列

像这样的标签

<div id="info">
    <h1>some title</h1>
    <p>some content</p>
    <h1>some title</h1>
    <p>some content</p>
    <h1>some title</h1>
    <p>some content</p>
</div>

每个之后我都需要一个图像分隔符

标签，但不是在最后一个之后

我定义了以下 CSS 样式：

#info {
    margin-left:245px;
    width: 545px;
}

#info h1{
    color:#000;
    font-size:24px;
    font-weight:100;
}

#info p{
    color:#6c6f70;
    font-size:22px;
}

#info p:last-child :after{
    content: "";
}

#info h1+p:after{
    content: " " url(../img/dotseparator.png);
    padding-top:25px;
    display:block;
    height:8px;
}

但是即使在最后一段之后我也得到了分隔符......你能帮我解决我的风格有什么问题吗？谢谢！

Answer 1

<-HR-> 对于分隔符演示很简单

<div id="info">
    <h1>some title</h1>
    <hr>
    <p>some content</p>
    <hr>
    <h1>some title</h1>
     <hr>
    <p>some content</p>
     <hr>
    <h1>some title</h1>
     <hr>
    <p>some content</p>
     <hr>
</div>

Answer 2

尝试这个

 #info h1+p:not(last-of-type):after{
        content: " " url(../img/dotseparator.png);
        padding-top:25px;
        display:block;
        height:8px;
    }