*选择器的CSS专用性

Question

我有一个css重置，我把边距设为零。然后再往下看，我想给所有的元素加上一个边距--底部。但它不起作用，我找不到原因。

我尝试使用！重要规则，但这也不起作用，也不是我真正想要的解决方案。在我看来，特异性应该是有效的，因为它们都有特异性0,0,1，最后一个规则应该适用。

或者就像*规则具有特异性0,0,0，并且不能“击败”html和body标记之后的其他选择器的特异性，因为它们具有特异性0,0,1？

html,body,address, article, aside, footer, header, h1, h2, h3, h4,
h5, h6, hgroup, main, nav, section {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

body > * {
    margin-bottom: calc(1 * var(--line-height));
}

我想要的结果是应该应用body > *。

Answer 1

如果您想要所有可以使用的元素

* {
   margin-bottom: 1rem;
}

>符号是一个子组合子，它将只针对作为第一个元素的直接后代的元素。

我的猜测是，这是设计目标元素的样式，但这些元素并不是您期望的目标元素。

为了更好地可视化这一点，请尝试将这些元素的边框样式设置为intstead：

body > * {
    border: 10px solid red;}