Css DIV:after-在DIV之后添加内容

我正在设计一个简单的网站，我有一个问题。 毕竟，我希望带有

class=“A”

的

标签底部有一个图像分隔符，就在

之后（请参阅红色部分的图像）。我正在使用CSS操作符

：after

创建内容：

.A:after {
    content: "";
    display: block;
    background: url(separador.png) center center no-repeat;
    height: 29px;
}

问题是图像分隔符不是显示在

之后，而是正好显示在

的内容之后，在我的例子中，我有一个段落

。如何对其进行编码，使图像分隔符显示在

之后，而不考虑分区A的高度和内容？

将您的

绝对放在底部，不要忘记给出

分区A

A

位置：相对

-

---

尽管它仍然只是在选择器的内容之后，而不是在层次结构之后，如果您需要使用某种活动脚本，那么这可能是一个问题。然而，这不是一个CSS操作，您需要一个DOM操作符（即Javascript）来实际向页面添加元素；以jQuery的Add和Insert操作符为例，您是否考虑过设置

：after

内容的样式，使其看起来只是在对象外部，而保持在对象内部？

    .A {
        position: relative;
        margin: 40px 0;
        height: 40px;
        width: 200px;
        background: #eee;
    }

    .A:after {
        content: " ";
        display: block;
        background: #c00;
        height: 29px;
        width: 100%;

        position: absolute;
        bottom: -29px;
    }​