css - 仅在给定类的两个元素之间添加一个元素(使用 css)

Question

我想知道是否可以在给定类的两个元素之间插入一个新元素。我喜欢只使用 css，例如:

<div class="a">
<div class="a">

<div class="b">
<div class="b">
<div class="b">
<div class="a">

<div class="b">
<div class="a">

<div class="b">
<div class="a">

我想在“a”和“b”之间插入一个新元素(反之亦然):

<div class="a">
<div class="a">
<blank-line>

<div class="b">
<div class="b">
<div class="b">
<div class="a">
<blank-line>

<div class="b">
<div class="a">
<blank-line>

<div class="b">
<div class="a">

Answer 1

如果您只需要元素之间的空间，请试试这个:

.a + .b {
    padding-top: 50px;
}

jsFiddle Demo

---

如果你想获得更多的控制，使用::before，像这样:

.a + .b::before {
    content: '';
    display: block;
    height: 50px;
    background: green;
}

jsFiddle Demo