css 标准标签边距取决于前面/后面的元素

Question

我想将标准标签 (p h1...h6 ul li) 的 css margin 属性设置为依赖于标签之前或之后的元素。例如，如果 DOM 中它之前的元素是 p，我想将 h1 的 margin-top 设置为 10px，但如果它之前的元素是/ul，我想将其设置为 20px。我需要仅使用 css 来完成此操作，而无需使用间隔符或 div——因为内容是由 CMS 用户插入的，除了将普通的 p h1...h6 ul li 应用到他们的文本之外，他们别无他法。

这可以用 css 实现吗？

谢谢!

Answer 1

您可以使用相邻的兄弟 CSS 选择器:

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

将对 p 元素之后的 h1 元素应用 10px 的 margin-top。

Here's a good article on the subject.