Html 什么是：：content/：：slotted伪元素，它是如何工作的？

这对谷歌来说是不可能的，因为每一篇谈论

：before

和

：after

伪元素的文章似乎都使用了“content”这个词

我在CSS技巧文章中听说了这一点，解释了如何实现图像滑块作为web组件的示例用例。因此，其中出现的代码示例如下：

CSS

#slides ::content img {
   width: 25%;
   float: left;
}

HTML

<template>
  ...
  <div class="inner">
    <content select="img"></content>
  </div>
</template>

资料来源：

---

这是有帮助的，但我仍然觉得整个事情相当不透明。是否还有其他见解？

在Web组件/Shadow DOM的未来实现中，将使用

：：slotted

伪元素替换

：content

伪元素。同样，这个伪元素所针对的元素已经从

变为太糟糕了！不幸的是
：：content
是v0，已被弃用

现在应该使用v1
：：slotted

而且，
被弃用，取而代之的是

请参阅：

另请参见：
可能会提供更多的见解。@Paulie\u刚刚看到了备忘单（在上面添加了一个有问题的链接）-谢谢！但仍发现整个概念尚不清楚。什么是分布式节点？更多阅读-
：：content
已重命名为
：：slotted
感谢Oriol@乔恩，我更新了我的答案以反映这一点。一旦浏览器将支持转移到
slot
和
slotted
，我将替换提及的
content
和
：：content
，并可能会更新该问题，以便它对未来的读者仍然有用！这是一个惊人的答案。非常感谢你花时间写这篇文章@乔恩，不客气！我很高兴你觉得它有用。如果你还在寻找信息的话，HTML5Rocks也有一个新的例子。不推荐用反斜杠转义的换行符，因为它不是ECMAScript@JuanMendes从我刚才读到的，后跟新行的\不是字符转义序列，而是行继续。新行不会成为字符串的一部分。这只是一种将字符串分散在多行上的方法（例如，为了更容易地编辑代码）[……]”。显然，这根本不是一种逃避。仅供参考：为了进一步了解Web组件，您可以访问Zeno Rocha在Front Trends 2014上展示的幻灯片（“未来称为Web组件”）（谷歌开发者专家计划成员）-
::content h1 {
    color: red;
}