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

Question

我想将标准标签 (p h1...h6 ul li) 的 css 边距属性设置为依赖于紧接在标签之前或之后的元素。例如，如果 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;
}

将 10px 的 margin-top 应用于h1紧跟在元素之后的p元素。

这是一篇关于这个主题的好文章。