当下一个项目具有CSS类时添加边距

Question

我有以下html

<div class="post">
    <h2 class="title">TITLE: Kausalya</h2>
    <p class="content">CONTENT: Shaunaka Shakha</p>
</div>

<div class="post">
    <h2 class="title">TITLE: Kausalya</h2>
    <span class="author">AUTHOR: Ayuidasht</span>
    <p class="content">CONTENT: Shaunaka Shakha</p>
</div>

我可以用jQuery做到这一点，但我怎么能用css做到这一点？

$('.title').next('.content').css('margin-top','20px');

如果它出现在标题之后，我只需要在内容上留一个保证金。我知道我可以用css做到这一点，但我忘记了如何，我无法弄清楚它叫什么。

Answer 1

您正在寻找adjacent sibling combinator, +。

Example Here

.title + .content {
    margin-top:20px;
}

Answer 2

h2 + p{
   margin-top: 20px;
}

https://developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_selectors