如何在Shadow Root外部通过CSS选择器选中其子元素?
如何从阴影根外部选中并样式化其中的img元素?
我需要选中下面<curie-image>组件阴影根内的<img>元素,为它设置object-fit属性:
<curie-image id="DynamicImage1"> #shadow-root <img alt="No Image" style="width:100%;height:100%" src="data:image;base64, ..."> </curie-image>
目前面临这些限制:
- 无法访问底层JavaScript,没法给阴影根内的子元素添加
part属性,因此通过::part选择器样式化阴影DOM子元素的方案不可用 :host()选择器也无法使用,因为它必须在阴影树的上下文环境中才能生效
请问在这些限制下,有没有能从阴影根外部选中其子元素的CSS选择器?
另外还有一个奇怪的现象:全局CSS中编写的简单img选择器理论上应该匹配所有<img>元素(包括阴影根内的),但实际并没有为目标<img>设置object-fit属性,相关代码和样式检查结果如下:
... img { object-fit: none; }

内容的提问来源于stack exchange,提问作者Adrian
相关产品推荐
相关产品推荐

