为开槽元素中的后代元素设置样式

2024-06-20

是否可以选择开槽元素中的后代元素?

像这样的例子:

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

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

这不起作用


不,您只能选择顶级节点::slotted().

::slotted() 中的选择器只能是复合选择器 https://drafts.csswg.org/selectors-4/#compound, so div p不是有效的。

根据伊藤隼人 https://hayato.io/2016/shadowdomv1/#v1_8 :

此限制的原因是为了使选择器样式引擎在性能方面更加友好。

See 样式示例 https://developers.google.com/web/fundamentals/web-components/shadowdom#stylinglightdom在 Shadow Dom v1 演示中。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

为开槽元素中的后代元素设置样式 的相关文章