如果您创建具有影子根的自定义元素，并使用:host选择器向其添加样式规则：
<style>
:host {
color: red;
}
</style>
然后使用元素选择器在轻型DOM中为自定义元素添加样式：
<style>
custom-element {
color: blue;
}
</style>
元素选择器中的样式取代:host选择器中的样式。可以说，这是理想的行为-但我很好奇为什么这是正确的...如果:host是一个伪类，它是否应该具有比custom-element更高的特异性，并且优先？如果这是该规则的例外，它是否在某个地方的规范中记录了？
答案 0 :(得分：1)
这是真的，因为这是您所说的理想行为。
它是根据CSS Scoping Module Level 1规范的需要实现的：
当比较两个具有不同树上下文的声明时，对于常规规则，阴影（包括树顺序）中的较早者胜出；对于重要规则，对于阴影（包括树顺序）中的较晚的人胜者。
注意：这与范围样式的工作方式相反。
答案 1 :(得分：1)
除了@Supersharp所说的以外，还这样想：
:host的使用类似于浏览器对所有内置元素的默认样式。
添加 ANY CSS时，您将覆盖默认值。
这就是CSS的工作方式，我很高兴。