在投影元素中为后代元素设置样式

Question

在分发的元素中选择后代元素是否可行？

例如：

::slotted(div p) {
        color: blue;
    }

<div><p>test</p><div>

它不起作用

- asv

---

类似于 https://dev59.com/R6nka4cB1Zd3GeqPTshq - Intervalia

Answer 1

不可以，你只能使用::slotted()选择顶层节点。

::slotted()内部的选择器只能是一个复合选择器，因此div p是无效的。

根据Hayato Ito的说法：

这个限制的原因是为了使选择器样式引擎友好，从而提高性能。

请参见Shadow Dom v1演示中的样式示例。

- Supersharp