css - 优化 CSS 选择器。 `*+p` 比 `p+*` 成本低吗

Question

根据我对浏览器的 CSS 处理算法的了解，选择器 *+p 对性能的影响小于 p+*，不是吗？

因此，在 p+* 中，浏览器会扫描页面上的所有元素，并且 p 之后的元素会应用相应的规则。在*+p中，首先它只查找p，但是在找到p之前的某个元素后它是否立即停止搜索，从而减少“搜索迭代”？或者 * 仍然扫描这里的所有内容。

此外，哪些工具可以显示 CSS 加载时间和其他“重量级”信息。仅找到那些搜索未使用或多余规则并压缩 CSS 以减小尺寸的规则。

在上下文中 - 我需要将 top-margin 应用于 p 之后的任何元素(p+p 除外)，内容是动态生成的。读到旧浏览器受到通用选择器的影响后，这个问题就出现了。

Answer 1

向所有 p 元素添加 bottom margin 会不会有相同的结果？然后，您可以为 p+p 添加一个带有负上边距的规则来抵消这种影响，例如:

p {
    margin-bottom: 10px;
}

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