css – 如何在块元素之间添加垂直间距,但不能在顶部和底部

说我有一堆P,LI或DIV元素,他们之间没有任何东西.我想控制它们之间的垂直间距,所以它们不太紧密.但是我不想添加顶部和底部的任何空间,因为这是由父元素处理,我不需要更多.有没有一个简单的方法来做这个工作的所有块元素？

说我有这样的东西：

p {
  margin: 5px 0;
  }

接着

<div>
   <p>1</p>
   <p>2</p>
   <p>3</p>
   <p>4</p>
 </div>

但是我不想要在p 1以上或者p 4以下的5px,因为div已经有了padding,我不想搞砸了.我只想要在p 1和p 2,p 2和p 3等之间的10px.

我相信我可以做一些琐事(我有很多次),但是正在寻找一些更清洁的东西,我不需要为这种常见情况做很多特殊的套管.

解决方法

使用相邻选择器

p + p { margin-top: 10px; }

基本上这个概念是,如果一个p在另一个p之后给出10px的边距.

你的用法是类似的

p + p,li + li,div + div { 
    margin-top: 10px;
}