css - 影子DOM是否取代:: before和:: after？

CSS Scoping说



CSS Pseudo-Elements将::before和::after描述为



那么，其中哪一个是正确的？

首先，将影子主机的所有内容(不包括::before和::after)替换为 Activity 影子树的内容。然后，::before和::after在影子主机中生成框。

首先，::before和::after在影子主机中生成框。然后，将影子主机的所有内容(包括::before和::after)替换为 Activity 影子树的内容。

Firefox和Chrome都是前者，但是规范是否描述了这种行为？

var root = document.querySelector('div').createShadowRoot();
root.innerHTML = "<p>Shadow content</p>";

div::before, div::after {
  content: 'Generated content';
}

<div>Content</div>

最佳答案

CSS作用域规范作者在此处。

答案实际上是，正式...未定义!

在编写“作用域”规范时，我没有考虑这种交互。我将向该列表发送电子邮件，我们会弄清楚。几乎可以肯定的是，我们将依靠当前使用的浏览器(即使在影子主机中，似乎也使:: before / after“按预期”工作)。

编辑:工作组的响应是一致的-当前的实现行为(在阴影主机上工作之前/之后)是应该的。稍后，我将其编辑到“作用域”规范中。